带有隐藏函数的AngularJS自定义指令
AngularJS custom directive with hide function
我正在尝试创建一个AngularJS自定义指令,如果元素在变量中,该指令将隐藏元素。
例如,我有三个从指令生成的链接:
- 主页
- 关于
- 隐藏
我想隐藏"隐藏"链接。
这是我的观点:
<ul>
<menu link="Home"></menu>
<menu link="About"></menu>
<menu link="Hide"></menu>
</ul>
指令:
app.directive('menu', function() {
return {
scope: {
link: "@"
},
template: '<li ng-hide="hideMenu(link)">{{link}}</li>',
controller: function($scope) {
var hideLink = 'Hide';
function hideMenu(link) {
if (hideLink == link) {
return true;
}
}
}
};
});
和Plunker。
谢谢!
要使您的函数在模板中可用,它必须在您的范围内。这是更新后的代码:
app.directive('menu', function() {
return {
scope: {
link: "@"
},
template: '<li ng-hide="hideMenu(link)">{{link}}</li>',
controller: function($scope) {
var hideLink = 'Hide';
$scope.hideMenu = function(link) {
if (hideLink == link) {
return true;
}
}
}
};
});
在指令$scope.hideMenu = hideMenu;
中添加到控制器
app.directive('menu', function() {
return {
scope: {
link: "@"
},
template: '<li ng-hide="hideMenu(link)">{{link}}</li>',
controller: function($scope) {
var hideLink = 'Hide';
function hideMenu(link) {
if (hideLink == link) {
return true;
}
}
$scope.hideMenu = hideMenu;
}
};
});
相关文章:
- AngularJS自定义日期选择器指令
- AngularJS自定义过滤器未触发点击事件
- 用于分页的 AngularJS 自定义过滤器
- AngularJS:自定义 404 拦截器句柄 - 带有 URL 的响应
- 指令中的 AngularJS 自定义过滤器以格式化值
- AngularJS自定义指令ng显示/ng隐藏
- AngularJS自定义过滤器调用了两次,并在第二次调用时删除输入数据
- 带有隐藏函数的AngularJS自定义指令
- angularjs:自定义直接中的绑定数据在使用“”后不再更新;track-by-;在ng重复中
- 刷新/重新加载angularjs自定义指令
- angularjs自定义模块与$http注入
- 如何使用angularJS自定义服务从REST API获取数据
- AngularJS自定义指令在继承父作用域时访问模板中的属性
- Angularjs自定义服务变量未被$http成功定义
- 来自同一变量的 AngularJS 自定义订单
- AngularJS自定义指令和ctrl,如果出现以下情况,则抛出错误:ctrl的方法与ctrl的名称相同
- Angularjs 自定义指令 scope:true 更改它的父范围
- AngularJS自定义过滤器被调用两次
- AngularJS 自定义指令 - 将属性设置为等于范围对象值
- Angularjs 自定义指令双向绑定不起作用