Questions tagged «angularjs-scope»

在AngularJS中,范围是指引用应用程序模型的对象。它是表达式的执行上下文。

6
在自定义指令的范围绑定中使用符号“ @”,“&”,“ =”和“>”:AngularJS
我已经在AngularJS中的自定义指令的实现中阅读了很多有关这些符号的用法,但是这个概念对我来说仍然不清楚。我的意思是,如果我在custom指令中使用范围值之一,那意味着什么? var mainApp = angular.module("mainApp", []); mainApp.directive('modalView',function(){ return{ restrict:'E', scope:'@' OR scope:'&' OR scope:'=' OR scope:'>' OR scope:true } }); 运行代码段隐藏结果展开摘要 我们在这里对示波器做什么呢? 我也不确定官方文档中是否存在“ scope:'>'”。它已在我的项目中使用。 编辑1 在我的项目中,使用“ scope:'>'”是一个问题,现已修复。


11
外部JS函数的AngularJS访问范围
我正在尝试查看是否存在通过外部javascript函数访问控制器内部范围的简单方法(与目标控制器完全无关) 我在其他几个问题上看到 angular.element("#scope").scope(); 会从DOM元素中检索范围,但是我的尝试目前未产生正确的结果。 这是jsfiddle:http : //jsfiddle.net/sXkjc/5/ 我目前正在经历从纯JS到Angular的过渡。我试图实现这一目标的主要原因是要保持原始库代码尽可能完整。无需我将每个功能添加到控制器。 关于如何实现这一目标的任何想法?也欢迎对上面的小提琴发表评论。

1
如何在AngularJS中进行双向过滤?
AngularJS可以做的有趣的事情之一是将过滤器应用于特定的数据绑定表达式,这是一种方便的方法,例如,应用区域性特定的货币或模型属性的日期格式。在范围上具有计算属性也很好。问题在于这些功能都不适用于双向数据绑定方案-从作用域到视图仅单向数据绑定。在一个本来不错的图书馆中,这似乎是一个明显的遗漏-还是我错过了什么? 在KnockoutJS中,我可以创建一个读/写计算属性,该属性允许我指定一对函数,一个被调用以获取该属性的值,一个被设置为属性时被调用。例如,这使我可以实现文化意识的输入-允许用户键入“ $ 1.24”,然后将其解析为ViewModel的float,并在输入中反映出ViewModel的更改。 我可以找到与此最相似的东西是使用。$scope.$watch(propertyName, functionOrNGExpression);这允许我在$scope更改属性时调用一个函数。但这不能解决例如文化意识的输入问题。当我尝试$watched在$watch方法本身中修改属性时,请注意问题: $scope.$watch("property", function (newValue, oldValue) { $scope.outputMessage = "oldValue: " + oldValue + " newValue: " + newValue; $scope.property = Globalize.parseFloat(newValue); }); (http://jsfiddle.net/gyZH8/2/) 当用户开始输入时,输入元素会非常混乱。我通过将属性拆分为两个属性来改进它,一个用于未解析的值,另一个用于已解析的值: $scope.visibleProperty= 0.0; $scope.hiddenProperty = 0.0; $scope.$watch("visibleProperty", function (newValue, oldValue) { $scope.outputMessage = "oldValue: " + oldValue + " newValue: " + …

14
控制器不是函数,未定义,但在全局定义控制器时
我正在使用angularjs编写示例应用程序。我在chrome浏览器上遇到以下错误。 错误是 错误:[ng:areq] http://errors.angularjs.org/1.3.0-beta.17/ng/areq?p0=ContactController&p1=not%20a%20function%2C%20got%20undefined 呈现为 参数“ ContactController”不是函数,未定义 码 <!DOCTYPE html> <html ng-app> <head> <script src="../angular.min.js"></script> <script type="text/javascript"> function ContactController($scope) { $scope.contacts = ["abcd@gmail.com", "abcd@yahoo.co.in"]; $scope.add = function() { $scope.contacts.push($scope.newcontact); $scope.newcontact = ""; }; } </script> </head> <body> <h1> modules sample </h1> <div ng-controller="ContactController"> Email:<input type="text" ng-model="newcontact"> <button ng-click="add()">Add</button> <h2> Contacts …


10
当选定的ng-option更改时获取价值
我在.html页面中有一个下拉列表, 落下: <select ng-model="blisterPackTemplateSelected" data-ng-options="blisterPackTemplate as blisterPackTemplate.name for blisterPackTemplate in blisterPackTemplates"> <option value="">Select Account</option> </select> 当用户选择一个值时,我想执行一个动作。因此,在我的控制器中,我做到了: 控制器: $scope.$watch('blisterPackTemplateSelected', function() { alert('changed'); console.log($scope.blisterPackTemplateSelected); }); 但是更改下拉列表中的值不会触发代码: $scope.$watch('blisterPackTemplateSelected', function() 结果,我ng_change = 'changedValue()'在select标记上尝试了另一个带有:的方法 和 功能: $scope.changedValue = function() { console.log($scope.blisterPackTemplateSelected); } 但是blisterPackTemplateSelected会存储到子作用域中。我读到父级无法访问子级作用域。 当下拉列表中的选定值更改时,执行某项操作的正确/最佳方法是什么?如果是方法1,我的代码在做什么错?

5
在AngularJS中更新父范围变量
我有两个控制器,一个封装在另一个中。现在,我知道子范围从父范围继承属性,但是有没有办法更新父范围变量?到目前为止,我还没有遇到任何明显的解决方案。 在我的情况下,我在表单中有一个日历控制器。我想从父范围(即表单)更新开始日期和结束日期,以便表单在提交时具有开始日期和结束日期。


5
AngularJS:从模型数组中拼接模型元素时,不会更新ng-repeat列表
我有两个控制器,并使用app.factory函数在它们之间共享数据。 单击链接时,第一个控制器在模型数组(pluginsDisplayed)中添加一个小部件。将小部件推入数组,并将此更改反映到视图中(使用ng-repeat显示数组内容): <div ng-repeat="pluginD in pluginsDisplayed"> <div k2plugin pluginname="{{pluginD.name}}" pluginid="{{pluginD.id}}"></div> </div> 该小部件基于三个指令k2plugin,remove和resize构建。remove指令将跨度添加到k2plugin指令的模板。单击该范围时,将使用删除共享数组中的右侧元素Array.splice()。共享阵列已正确更新,但更改未反映在视图中。但是,当添加另一个元素时,在删除之后,视图将正确刷新,并且不会显示先前删除的元素。 我怎么了?您能解释一下为什么这行不通吗?有没有更好的方法可以完成我想对AngularJS进行的操作? 这是我的index.html: <!doctype html> <html> <head> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.5/angular.min.js"> </script> <script src="main.js"></script> </head> <body> <div ng-app="livePlugins"> <div ng-controller="pluginlistctrl"> <span>Add one of {{pluginList.length}} plugins</span> <li ng-repeat="plugin in pluginList"> <span><a href="" ng-click="add()">{{plugin.name}}</a></span> </li> </div> <div ng-controller="k2ctrl"> <div ng-repeat="pluginD in pluginsDisplayed"> <div …

9
检查对象是否为空,是否可以在ng-show中使用,但不能从控制器中使用?
我有一个这样声明的JS对象 $scope.items = {}; 我还有一个$ http请求,该请求用项目填充此对象。我想检测该项目是否为空,看来ng-show支持此项目。我输入 ng-show="items" 并且神奇地起作用了,我也想从控制器上做同样的事情,但是我似乎无法使它起作用,看来我可能不得不遍历该对象以查看它是否具有任何属性或使用lodash或下划线。 有其他选择吗? 我确实尝试过 alert($scope.items == true); 但在创建对象并填充时$http,它始终返回false,因此它不能那样工作。

7
如何将一个控制器注入到AngularJS中的另一个控制器中
我是Angular的新手,正在尝试弄清楚该怎么做... 使用AngularJS,我如何注入要在另一个控制器中使用的控制器? 我有以下片段: var app = angular.module("testApp", ['']); app.controller('TestCtrl1', ['$scope', function ($scope) { $scope.myMethod = function () { console.log("TestCtrl1 - myMethod"); } }]); app.controller('TestCtrl2', ['$scope', 'TestCtrl1', function ($scope, TestCtrl1) { TestCtrl1.myMethod(); }]); 执行此操作时,出现错误: Error: [$injector:unpr] Unknown provider: TestCtrl1Provider <- TestCtrl1 http://errors.angularjs.org/1.2.21/$injector/unpr?p0=TestCtrl1Provider%20%3C-%20TestCtrl1 我是否应该甚至尝试在另一个控制器中使用一个控制器,还是应该将此服务用作服务?

2
AngularJS中具有ng-repeat范围的指令隔离范围
我有一个带有隔离范围的指令(以便我可以在其他地方重用该指令),当我将此指令与一起使用时ng-repeat,它将无法正常工作。 我已经阅读了有关此主题的所有文档和Stack Overflow的答案,并了解了这些问题。我相信我避免了所有常见的陷阱。 因此,我知道我的代码由于ng-repeat指令创建的作用域而失败。我自己的指令创建了一个隔离范围,并与父作用域中的对象进行了双向数据绑定。我的指令将为该绑定变量分配一个新的对象值,并且在不使用我的指令的情况下ng-repeat(父变量已正确更新),这可以完美地工作。但是,使用时ng-repeat,赋值将在ng-repeat作用域中创建一个新变量,并且父变量看不到更改。所有这些都是根据我所读的内容预期的。 我还读到,当给定元素上有多个指令时,只会创建一个作用域。并且priority可以在每个指令中设置a,以定义指令的应用顺序;指令按优先级排序,然后调用其编译功能(在http://docs.angularjs.org/guide/directive中搜索优先级一词)。 因此,我希望可以使用优先级来确保我的指令先运行并最终创建一个隔离范围,并且在ng-repeat运行时,它会重新使用隔离范围,而不是创建一个原型上从父范围继承的范围。该ng-repeat文件指出,在优先级别的指令运行1000。不清楚1是较高优先级还是较低优先级。当我1在指令中使用优先级时,它没有什么不同,因此我尝试了2000。但这使情况变得更糟:我的双向绑定变为undefined,我的指令不显示任何内容。 我制造了一个小提琴来展示我的问题。我已经priority在指令中注释掉了设置。我有一个名称对象列表和一个名为的指令,该指令name-row显示名称对象中的名字和姓氏字段。单击显示的名称时,我希望它selected在主作用域中设置一个变量。名称数组,selected变量name-row使用双向数据绑定传递给指令。 我知道如何通过在主作用域中调用函数来使其工作。我也知道,如果selected在另一个对象内部,并且绑定到外部对象,则一切正常。但是我目前对这些解决方案不感兴趣。 相反,我的问题是: 如何防止ng-repeat创建从父作用域继承的原型作用域,而使用我的指令的isolate-scope? 为什么2000我的指令中的优先级不起作用? 使用Batarang,是否可以知道正在使用哪种类型的示波器?

4
从指令中调用控制器函数,而AngularJS中没有隔离范围
我似乎无法找到一种无需使用隔离范围就可以在指令中从父范围调用函数的方法。我知道,如果我使用隔离作用域,则可以在隔离作用域中使用“&”来访问父作用域上的函数,但是在不必要时使用隔离作用域会产生后果。考虑以下HTML: <button ng-hide="hideButton()" confirm="Are you sure?" confirm-action="doIt()">Do It</button> 在这个简单的示例中,我想显示一个JavaScript确认对话框,并且仅当他们在确认对话框中单击“确定”时才调用doIt()。使用隔离范围很简单。该指令如下所示: .directive('confirm', function () { return { restrict: 'A', scope: { confirm: '@', confirmAction: '&' }, link: function (scope, element, attrs) { element.bind('click', function (e) { if (confirm(scope.confirm)) { scope.confirmAction(); } }); } }; }) 但是问题是,因为我使用的是隔离范围,所以上例中的ng-hide不再针对父范围执行,而是在隔离范围内执行(因为在任何指令上使用隔离范围都会导致该元素上的所有指令使用隔离范围)。这是上面示例的jsFiddle,其中ng-hide不起作用。(请注意,在此小提琴中,当您在输入框中键入“是”时,按钮应该隐藏。) 另一种选择是不使用隔离范围,这实际上是我在这里真正想要的,因为不需要将此指令的范围隔离。我唯一的问题是,如果不在隔离范围内传递方法,该如何在父范围内调用方法? 这是一个我没有使用隔离范围的jsfiddle,而ng-hide可以正常工作,但是,当然,对confirmAction()的调用不起作用,并且我不知道如何使它起作用。 请注意,我真正要寻找的答案是如何在不使用隔离范围的情况下在外部范围内调用函数。而且我对使该确认对话框以另一种方式工作不感兴趣,因为该问题的重点是弄清楚如何对外部作用域进行调用,并且仍然能够使其他指令在父作用域内起作用。 另外,如果其他指令仍然可以对父作用域起作用,那么我会很想听到使用隔离作用域的解决方案,但是我认为这是不可能的。


By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.