Javascript 如何在元素之间绑定css属性？_Javascript_Css_Angularjs

Javascript 如何在元素之间绑定css属性？

javascript css angularjs

Javascript 如何在元素之间绑定css属性？,javascript,css,angularjs,Javascript,Css,Angularjs,我希望元素A的宽度与元素B相同。每当B改变时，A也应该改变 angularjs的做法是什么这里有一把小提琴来说明我的问题：我希望下面的链接能有所帮助 HTML代码 <body> <h1>Hello Plunker!</h1> <div ng-controller="MyCtrl"> <div id='red' class="red"></div> <div class

我希望元素A的宽度与元素B相同。每当B改变时，A也应该改变

angularjs的做法是什么

这里有一把小提琴来说明我的问题：

我希望下面的链接能有所帮助

HTML代码

  <body>
    <h1>Hello Plunker!</h1>
    <div ng-controller="MyCtrl">
      <div id='red' class="red"></div>
      <div class="blue" ng-style="{width:{{getRedWidth()}}}"></div>
    </div>
  </body>

如何更改第一个

div

的宽度？@putvande仅适用于窗口大小是否有不将宽度应用于父元素的原因。另外，如果您将

宽度

更改为

最小宽度

和

最大宽度

，则可能不需要javascript来控制宽度。@Joonas实际上，我过于简化了。其实没那么简单。请试着回答我的问题：如何使用AngularJS绑定css我仍然不满足于仅仅使用css就不能做到这一点…使用jQuery。“你最好不要使用Angular！”putvande因为用户Moshe没有提到其他元素（红色），它如何改变宽度，所以很难给我确切的答案。但是，造型是一种有棱角的造型方式。我删除了jquery的依赖项并更新了我的plnkr链接

  <body>
    <h1>Hello Plunker!</h1>
    <div ng-controller="MyCtrl">
      <div id='red' class="red"></div>
      <div class="blue" ng-style="{width:{{getRedWidth()}}}"></div>
    </div>
  </body>

var app = angular.module('app', []);

app.controller('MyCtrl', function mainController($scope){

  $scope.getRedWidth = function (){

    var red = document.getElementById('red');
    var redWidth = red.offsetWidth;
    console.log(redWidth);
    return "'"+redWidth+"px'";
  }
});