- iOS/Objective-C 元类和类别
- objective-c - -1001 错误,当 NSURLSession 通过 httpproxy 和/etc/hosts
- java - 使用网络类获取 url 地址
- ios - 推送通知中不播放声音
编辑:
这个plunker中有一个功能示例:
http://plnkr.co/edit/GFQGP0q3o9RjLAlRANPS?p=preview
外部范围有 $scope.name = 'Donald'
所有指令声明为:
<directive-name binding="name">
这是一个多部分问题。我试图更好地理解具有监视或绑定(bind)到外部范围变量的独立范围。
使用非隔离作用域指令,一切正常:
// [WORKS]
.directive('noScopeWithWatch', function(){
return {
restrict: 'E',
link: function(scope, lElement, attrs) {
scope.$watch(attrs.binding, function(name){
lElement.text('Hello ' + name);
});
}
};
})
// returns Hello Donald
令人困惑的部分是当我尝试隔离范围并保持绑定(bind)时。所以我要求的是澄清为什么以下示例有效,而其他示例无效。
如果我只是添加带有“正常”绑定(bind)的范围隔离,它会失败:
// 1. [FAILS]
.directive('scopeWithWatch', function(){
return {
restrict: 'E',
link: function(scope, lElement, attrs) {
scope.$watch(attrs.binding, function(name){
lElement.text('Hello ' + name);
});
},
scope: { // new content
binding: '=' // new content
} // new content
};
})
// returns Hello undefined
但是,在 watch 中使用绑定(bind)变量作为字符串使其工作:
// 2. [WORKS]
.directive('scopeWithWatchString', function(){
return {
restrict: 'E',
link: function(scope, lElement, attrs) {
scope.$watch('binding', function(b){ // new content
lElement.text('Hello ' + b);
});
},
scope: {
binding: '='
}
};
})
// returns Hello Donald
当使用绑定(bind)变量作为对象失败时:
// 3. [FAILS]
.directive('scopeWithWatchObject', function(){
return {
restrict: 'E',
link: function(scope, lElement, attrs) {
scope.$watch(binding, function(b){ // new content
lElement.text('Hello ' + b);
});
},
scope: {
binding: '='
}
};
})
// Does not work at all
// Console output - ReferenceError: binding is not defined
尝试在隔离范围内引用绑定(bind)变量也不起作用,但至少不会导致异常:
// 4. [FAILS]
.directive('scopeWithWatchScopeObject', function(){
return {
restrict: 'E',
link: function(scope, lElement, attrs) {
scope.$watch(scope.binding, function(b){ // new content
lElement.text('Hello ' + b);
});
},
scope: {
binding: '='
}
};
})
// returns Hello undefined
事实证明,在模板中使用 mustaches 中的绑定(bind)变量是可行的:
// 5. [WORKS]
.directive('scopeWithTemplate', function(){
return {
restrict: 'E',
template: 'Hello {{binding}}', // new content and linker removed
scope: {
binding: '='
}
};
})
// returns Hello Donald
但尝试将它们用作链接器中的 mustache 不会。
// 6. [FAILS]
.directive('scopeWithWatchStringUsingMustashes', function(){
return {
restrict: 'E',
link: function(scope, lElement, attrs) { // new content
scope.$watch('binding', function(){ // new content
lElement.text('Hello {{binding}}'); // new content
}); // new content
}, // new content
scope: {
binding: '='
}
};
})
// returns Hello {{binding}}
这里是 plunker:
http://plnkr.co/edit/GFQGP0q3o9RjLAlRANPS?p=preview(我目前的版本是 78,如果你想在你的答案中使用它,请 fork。)
有人可以向我解释为什么有些示例有效而其他示例无效。
最佳答案
对此有一个简单的答案,适用于此处的所有示例。 $compile 上的 Angular 文档解释了这一点,但很容易引起误解。独立作用域的全部目的是创建一个仅由声明它的指令使用的作用域。为此,将创建一个新变量,将值存储为父作用域的别名。
主要有3种定义类型:@
, =
, &
@ or @attr - bind a local scope property to the value of DOM attribute. The result is always a string since DOM attributes are strings.
= or =attr - set up bi-directional binding between a local scope property and the parent scope property of name defined via the value of the attr attribute.
& or &attr - provides a way to execute an expression in the context of the parent scope.
@
和=
之间的唯一区别是双向支持。 =
定义仍将返回字符串结果。
因此,您所拥有的依次是:
<醇>binding='name'
与 binding: '='
匹配并且 'binding'
可作为别名访问在隔离范围内。The 'isolate' scope differs from normal scope in that it does not prototypically inherit from the parent scope. This is useful when creating reusable components, which should not accidentally read or modify data in the parent scope.
$compile
自动处理。lElement.text
就是文本。在文本分配中使用表达式需要在将文本发送到 dom 之前执行额外的手动编译步骤,否则 {{}}
表达式将被视为纯文本。关于javascript - 具有隔离范围的 Angularjs 指令需要澄清,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22294219/
我正在尝试在现有指令的基础上构建一个新指令,但我在我的过程中停止了。加载页面时,我面临以下错误: Multiple directives [directive#1, directive#2] aski
我是 angularjs 世界的新手,我只需要在数字类型的输入中输入从 1 到 10 的数字。不使用 HTML5 的 min 和 max 属性 我在 Jquery 中找到了一个示例,能否帮我将其转换为
我想使用 ionic与 Material 设计。我被困在使用带有自定义 CSS 的 ionic 指令和 angular-material 之间。 我读过使用 ionic 指令我们得到了很多高效的特性,
我创建了以下代码: var node = document.getElementById('TreeList'); var keys = Object.keys(model[0]); var trac
在 AngularJs 中没有提供 ng-enabled 指令。是否有任何适当的理由不在框架中提供该指令,因为当您可以使用 ng- 时,我们同时拥有 ng-show 和 ng-hide隐藏来实现我们的
我最近制作的程序有问题。基本上,它是 John Conway 人生游戏的简单版本,但它运行不正常。问题出在读取单元格及其邻居的状态并决定该单元格的 future 状态的代码中。这是代码的一部分(有点长
Dockerfile reference关于 FROM 指令的内容如下: FROM can appear multiple times within a single Dockerfile in or
我一直在尝试理解指令中孤立作用域和继承作用域之间的区别。这是我准备让自己理解的一个例子: HTML Inside isolated scope directive: {{m
知道如何从指令内部访问属性值吗? angular.module('portal.directives', []) .directive('languageFlag', ['$r
我正在通过将 c 程序与其等价的汇编程序进行比较来学习汇编。 这是代码。 .file "ex3.c" .section .rodata .LC0: .string "I am %d
我正在尝试写一个 Jenkinsfile并行执行一系列步骤。目标是拥有两个 agents (又名。 nodes )。一个应该进行 Windows 构建,另一个应该进行 linux 构建。但是,我不希望
我想知道为什么指令 FYL2XP1在 x86 架构上精确计算数学公式 y · log2(x + 1)。 这个公式有什么特别之处? 最佳答案 y操作数通常是编译时常量,暂时忘记 x + 1 . 自 lo
这个问题已经有答案了: Parameterize an SQL IN clause (41 个回答) 已关闭 8 年前。 第一个声明: Select GroupMember FROM Group 结果
我从 this question fork 并编辑了一个 plunker 我想做的是在数据加载后更新/填充 SELECT 元素(组合框),但有些事情不对劲。我检索数据,它位于 SELECT 元素的范围
我想创建一个简单的 markdown 指令,它接受元素中的一些内容,解析它并用 html 替换它。 所以这样: #Heading 或这个(其中 $scope.heading = '#Heading';
我对 Ansible 还很陌生,对于我对 local_action 指令的理解有一个简单的问题。 这是否意味着该命令完全在本地执行?假设你有这样的东西: local_action: command w
我有以下 HTML: ... ... 以及以下指令: myApp.directive('specialInput', ['$timeout', function($timeout)
如何在 .htaccess 中创建 Apache 指令强制文件 .mp4和 .pdf去下载?目前它们出现在浏览器窗口中。相反,我希望出现一个下载文件对话框。 最佳答案 将以下内容添加到 .htacce
我的问题是关于 C 中的 fork() 指令。我有以下程序: void main(){ int result, status; result = fork(); if(result=
我想要一个类似于 ng-model 的属性指令。我只想另外将一个输入字段值绑定(bind)到一个范围变量(只是在一个方向输入字段 ->范围变量)。所以我刚刚尝试了这个指令,但无论如何我都无法调用该指令
我是一名优秀的程序员,十分优秀!