使用角度获取父宽度

试图编写一个基本上将按钮的高度设置为包含div的宽度的指令（好吧，我可能会添加一点余量，但现在它的宽度）使用角度获取父宽度

我的问题是，我如何获得包含div的宽度。所以HTML如下所示：

<div bigbutton=""> 
     <button class="btn btn-info btn-lg btn-icon center-block"><i class="fa fa-plus fa-2x"></i><br><h6>Add one</h6></button> 
    </div>

尝试下面的（工作，但对窗口大小）

app.directive('bigbutton', function ($window) { 

    return { 
     restrict: 'A', 

     link: function (scope, elem, attrs) { 

      var winWidth = $window.clientWidth; 
      console.log("Window width: " + winWidth) 
      var winHeight = winWidth 
      elem.css('height', winWidth + 'px'); 
      elem.css('width', winHeight + 'px'); 
      elem.css('background-color', 'black'); 
     } 
    }; 
});

尽量选用事件（发现一些文字，说是可以做的伎俩，但不能让注射器接受$事件）

app.directive('bigbutton', function ($window, $event) { 

    return { 
     restrict: 'A', 

     link: function (scope, elem) { 

      var winWidth = $($event.target).parent().outerWidth(); 
      console.log("Window width: " + winWidth) 
      var winHeight = winWidth 
      elem.css('height', winWidth + 'px'); 
      elem.css('width', winHeight + 'px'); 
      elem.css('background-color', 'black'); 
     } 
    }; 
});

想想我可能会吠叫错误的树尽管。

来源

2016-01-22 vrghost

为什么你使用'限制：“A''对你所申请的一类指令？您应该使用'restrict：'C''或将该指令作为它自己的属性应用于按钮（'

嗯，我不确定A vs C是干什么的，但是如果我把它作为C完全停止工作（根本不会改变代码）。此外，我很抱歉，复制错误的HTML（现在编辑） – vrghost

限制是为了定义它是什么样的指令。属性，元素，类。 – ryanyuyu

好的，终于找到了。去找父母会出错。诀窍似乎ELEM [0]，而不是elem.parrent

app.directive('bigbutton', function ($window) { 

    return { 
     restrict: 'A', 

     link: function (scope, elem) { 

      var winWidth = elem[0].clientWidth; 
       //elem.parent().width; 
      console.log("Window width: " + winWidth) 
      var winHeight = winWidth 
      elem.css('height', winWidth + 'px'); 
      elem.css('width', winHeight + 'px'); 
      elem.css('background-color', 'black'); 
     } 
    }; 
});

来源

2016-01-22 17:56:03 vrghost

使用角度获取父宽度

回答

相关问题