从根节点NG-如果访问AngularJs控制器属性节点、控制器、属性、AngularJs
我想从哪里定义 NG-控制器相同的标记访问角控制器性能和使用隐藏标记 NG-如果如果属性语言是有不到一元。
要为precise这是我的不工作code 如下：
＆LT;李NG控制器=LanguageControllerNG-IF =languages.length→1＆GT; ...＆LT; /李＆GT; 但是，如果我做这样的事情再它的工作原理
＆LT;李NG控制器=LanguageController＆GT; ＆LT; DIV NG-IF =languages.length→1＆GT; ...＆LT; / DIV＆GT;＆LT; /李＆GT; 
当我尝试这
＆LT;李NG控制器=LanguageController数据-VAL ={{languages.length}}＆GT;... 输出为 ...数据-VAL =1.. 这意味着
我可以在根元素本身访问属性
要添加到它，当我使用 NG-节目来隐藏我的根元素也有效。感谢@ sarjan，德赛。问：但还是为什么不 NG-如果工作，并删除我的根里对象，而NG-演出的作品？
您可以访问 NG-如果或其他纳克指令在你定义你的控制器相同的元素。
NG-如果
借助 ngIf 指令删除或重新创建DOM树的一部分 基于一个前{pression}。如果分配给ngIf除权pression评估 到一个假值，则该元素是从DOM移除，否则一 元件的克隆重新插入到DOM
NG-节目
借助 ngShow 指令显示或隐藏基于给定的HTML元素 提供给ngShow属性除权pression。该元件示 或删除或添加这里的ng隐藏CSS类到隐藏 元素。
NG-如果 删除或重新创建元素设置里元素属性时，这意味着，条件变得虚假和NG-如果删除控制器和全元素。
有关 NG-节目这只是显示或隐藏元素不增加或开始if条件假去除这样它只是隐藏的元素不会删除它，当 $范围绑定到元素，它显示的数据，因为条件变成真。
检查下面的代码片段
\r\r
VAR对myApp = angular.module（'对myApp'，[]）;\r\rmyApp.controller（'MyCtrl'，函数（$范围）{\r\r $ scope.addresses = [{\r 状态：AL\r }，{\r 状态：CA\r }，{\r 状态：FL\r }];\r}）;\r\rmyApp.controller（'MyCtrl1'，函数（$范围）{\r\r $ scope.addresses = [];\r}）; \r
＆LT;脚本SRC =https://ajax.googleapis.com/ajax /libs/angularjs/1.2.23/angular.min.js\"></script>\r＆LT;机身NG-应用=对myApp＆GT;\r＆LT;李NG控制器=MyCtrlNG-秀=addresses.length大于0＆GT;计费状态：其中，TT＆GT;国家选择：{{地址}}＆LT; / TT＆GT;\r＆LT; /李＆GT;\r ＆LT;李NG控制器=MyCtrl1NG-秀=addresses.length大于0＆gt;这将不显示＆LT; TT＆GT;国家选择：{{地址}}＆LT; / TT＆GT;\r＆LT; /李＆GT;\r ＆LT; /身体GT; \r\r\r
I want to access the angular controller property from the same tag where ng-controller is defined and hide the tag using ng-if if the property languages is having less than one element.
To be precise this is what my not working code looks like:
<li ng-controller="LanguageController" ng-if="languages.length > 1">
...
</li>
But if I do something like this then it works.
<li ng-controller="LanguageController">
<div ng-if="languages.length > 1">...</div>
</li>
When I try this
<li ng-controller="LanguageController" data-val="{{languages.length}}">
...
The output is ... data-val="1".. which means
I can access the properties in the root element itself
To add to it, it also works when I use ng-show to hide my root element. Thanks to @sarjan-desai.
Question : But still why doesn't the ng-if work and remove my root li object, while the ng-show works?
You can access ng-if or other ng directive in same element where you define your controller.
ng-if
The ngIf directive removes or recreates a portion of the DOM tree based on an {expression}. If the expression assigned to ngIf evaluates to a false value then the element is removed from the DOM, otherwise a clone of the element is reinserted into the DOM.
ng-show
The ngShow directive shows or hides the given HTML element based on the expression provided to the ngShow attribute. The element is shown or hidden by removing or adding the .ng-hide CSS class onto the element.
ng-if removes or recreates elements which means when setting li element property, condition become false and ng-if remove controller and whole element.
For ng-show it's only shows or hides elements not adding or removing so in starting if condition false it only hide element not remove it and when $scope bind to element, it shows the data because condition becomes true.
Check below snippet
var myApp = angular.module('myApp', []);
myApp.controller('MyCtrl', function($scope) {
$scope.addresses = [{
'state': 'AL'
}, {
'state': 'CA'
}, {
'state': 'FL'
}];
});
myApp.controller('MyCtrl1', function($scope) {
$scope.addresses = [];
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<body ng-app="myApp">
<li ng-controller="MyCtrl" ng-show="addresses.length > 0">Billing State: <tt>State selected: {{addresses}}</tt>
</li>
<li ng-controller="MyCtrl1" ng-show="addresses.length > 0">This will not show.<tt>State selected: {{addresses}}</tt>
</li>
</body>
