Ember - 如何从控制器更改面板的高度？

我试图改变它的控制器中的一个呃.hbs文件面板的高度。我见过很多例子，但我似乎无法让事情正确。这里有一个我放在一起的jsbin，然后是我的代码。任何帮助都感激不尽。谢谢！Ember - 如何从控制器更改面板的高度？

版本：1.13.8 节点：0.12.7 NPM：2.13.4 操作系统：win32的64

http://jsbin.com/kopajitili/3/edit?html,js,output

HTML

<!DOCTYPE html> 
    <html> 
    <head> 
     <script src="https://code.jquery.com/jquery.min.js"></script> 
     <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet" type="text/css" /> 
     <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script> 
     <script src="https://code.jquery.com/jquery-1.11.3.js"></script> 
     <meta charset="utf-8"> 
     <title>Ember Starter Kit</title> 
     <link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/normalize/3.0.1/normalize.css"> 
     <script src="http://builds.emberjs.com/tags/v1.13.5/ember-template-compiler.js"></script> 
     <script src="http://builds.emberjs.com/tags/v1.13.5/ember.debug.js"></script> 
    </head> 
    <body> 
     <script type="text/x-handlebars"> 
     <div class="panel panel-primary" id="linkPanel" style="width:205px;"> 
      <div class="panel-heading"> 
       <h3 class="panel-title">Stuff</h3> 
      </div> 
      <div class="panel-body"> 
       Blah blah blah... 
      </div> 
      <div> 
       <button style="margin: 10px;" {{action "addHeight"}}>Add Stuff</button> 
      </div> 
     </div> 
     </script> 
    </body> 
    </html>

控制器（JS）

App = Ember.Application.create(); 
App.Router.map(function() { 
// put your routes here 
}); 

App.ApplicationController = Ember.Controller.extend({ 
    actions: { 
    addHeight: function() { 

// My goal here is to be able to increase the height 
// of the panel "#linkPanel" from an action. 

// In this version, I'm just trying to see 
// if I can reference the panel (I can't.) 

// In the commented out lines, I was trying 
// to actually change it. 

// Any help and/or advice will be much appreciated. 

alert(document.getElementById('#linkPanel')); 

//this.set('this.document.getElementById('#linkPanel').height',"500px"); 

//this.set('this.document.getElementById('#linkPanel').style.height',"500px"); 

//this.set('document.getElementById('#linkPanel').style.height',"500px"); 

//this.set('document.getElementById('#linkPanel').style.width',"500px") 

    //this.set('document.getElementById('#linkPanel').style',"Height=500px") 

    } 
    } 
});

来源

2015-09-26 BReece

当你打电话给getElementById时，你不应该预先考虑# - 这是jQuery语法。修改它document.getElementById('linkPanel');

修订您JSBin： http://jsbin.com/liwovawexu/edit?js,output

App = Ember.Application.create(); 

App.Router.map(function() { 
// put your routes here 
}); 

App.ApplicationController = Ember.Controller.extend({ 
    actions: { 
    addHeight: function() { 
     document.getElementById('linkPanel').style.height = "500px"; 
    } 
    } 
});

来源

2015-09-26 21:05:46 sbatson5

Ember - 如何从控制器更改面板的高度？

回答

相关问题