Tag: angularjs

如何使用$ scope。$ watch和$ scope。$在AngularJS中应用?

我不明白如何使用$scope.$watch和$scope.$apply 。 官方文档没有帮助。 我不明白的是: 他们连接到DOM? 我如何更新模型的DOM更改? 他们之间的连接点是什么? 我试过这个教程 ,但需要理解$watch和$apply是理所当然的。 $apply和$watch做什么的,我该如何恰当地使用它们?

AngularJS中控制器之间的正确通信方式是什么?

什么是控制器之间正确的通信方式? 我目前正在使用一个涉及window的可怕的软糖: function StockSubgroupCtrl($scope, $http) { $scope.subgroups = []; $scope.handleSubgroupsLoaded = function(data, status) { $scope.subgroups = data; } $scope.fetch = function(prod_grp) { $http.get('/api/stock/groups/' + prod_grp + '/subgroups/').success($scope.handleSubgroupsLoaded); } window.fetchStockSubgroups = $scope.fetch; } function StockGroupCtrl($scope, $http) { … $scope.select = function(prod_grp) { $scope.selectedGroup = prod_grp; window.fetchStockSubgroups(prod_grp); } }

使用$ scope。$ emit和$ scope。$ on

我怎么能发送我的$scope对象从一个控制器到另一个使用.$emit和.$on方法? function firstCtrl($scope) { $scope.$emit('someEvent', [1,2,3]); } function secondCtrl($scope) { $scope.$on('someEvent', function(mass) { console.log(mass); }); } 它不以我认为应该的方式工作。 如何$emit和$on工作?

在Angular JS中的控制器之间传递数据?

我有一个基本的控制器,显示我的产品, App.controller('ProductCtrl',function($scope,$productFactory){ $productFactory.get().success(function(data){ $scope.products = data; }); }); 在我看来,我在列表中显示这个产品 <ul> <li ng-repeat="product as products"> {{product.name}} </li> </ul 我想要做的是当有人点击产品名称,我有另一个名为购物车这个产品被添加的视图。 <ul class="cart"> <li> //click one added here </li> <li> //click two added here </li> </ul> 所以我的疑问是,如何将这个点击的产品从第一个控制器传递到第二个? 我认为购物车也应该是一个控制器。 我使用指令处理单击事件。 另外我觉得我应该使用服务来实现上述function只是无法形象如何? 因为购物车将预定义数量的产品可能是5/10取决于用户是哪一页。 所以我想保持这个通用。 更新: 我创build了一个服务来广播,并在第二个控制器我收到它。 现在查询是如何更新dom? 由于我的产品清单非常硬编码。

AngularJS的指令范围中'@'和'='有什么区别?

我仔细阅读了关于这个主题的AngularJS文档,然后用一个指令弄乱了。 这是小提琴 。 这里有一些相关的片段: 从HTML: <pane bi-title="title" title="{{title}}">{{text}}</pane> 从窗格指令: scope: { biTitle: '=', title: '@', bar: '=' }, 有几件事我没有得到: 为什么我必须用"{{title}}" '@'和"title"与'=' "title"一起使用"{{title}}" ? 我也可以直接访问父范围,而不用装饰我的元素的属性? 该文件说“通常是希望通过expression式和父范围从隔离的范围传递数据” ,但是这似乎也适用于双向绑定。 为什么expression路线会更好? 我发现另一个小提琴也显示expression式解决scheme: http : //jsfiddle.net/maxisam/QrCXh/

将HTML插入到视图中

是否有可能在AngularJS控制器中创buildHTML片段,并在视图中显示此HTML? 这来自将一个不一致的JSON blob变成id : value对的嵌套列表的要求。 因此,HTML在控制器中创build,我现在正在寻找显示它。 我已经创build了一个模型属性,但是不能在视图中渲染它,只需要打印HTML。 更新 看来问题出现在angular度渲染创build的HTML作为引号内的string。 将尝试find解决这个问题的方法。 示例控制器: var SomeController = function () { this.customHtml = '<ul><li>render me please</li></ul>'; } 示例视图: <div ng:bind="customHtml"></div> 给: <div> "<ul><li>render me please</li></ul>" </div>

AngularJS控制器中的'this'和$ scope

在AngularJS主页的“创build组件”部分 ,有这样的例子: controller: function($scope, $element) { var panes = $scope.panes = []; $scope.select = function(pane) { angular.forEach(panes, function(pane) { pane.selected = false; }); pane.selected = true; } this.addPane = function(pane) { if (panes.length == 0) $scope.select(pane); panes.push(pane); } } 注意select方法是如何被添加到$scope ,但addPane方法被添加到this 。 如果我将其更改为$scope.addPane ,则代码会中断。 该文件说实际上是有区别的,但是没有提到它们之间的区别: 先前版本的Angular(pre 1.0 RC)允许您与$scope方法交替使用,但现在不再这样了。 在范围内定义的方法this和$scope是可以互换的(angular将this设置为$scope ),但是在你的控制器构造函数中是不可以的。 this和$scope如何在AngularJS控制器中工作?

数据绑定在AngularJS中如何工作?

数据绑定如何在AngularJS框架中工作? 我没有在他们的网站上find技术细节。 当数据从视图传播到模型时,它如何工作或多或less都很清楚。 但是,AngularJS如何在没有setter和getters的情况下跟踪模型属性的变化? 我发现有JavaScript的观察者可以做这个工作。 但是它们在Internet Explorer 6和Internet Explorer 7中不受支持。 那么AngularJS如何知道我改变了以下内容,并在视图上反映了这种变化? myobject.myproperty="new value";

在AngularJS控制器之间共享数据

我试图在控制器之间共享数据。 用例是一种多步骤forms,input到一个input中的数据稍后在原始控制器之外的多个显示位置中使用。 下面的代码和jsfiddle在这里 。 HTML <div ng-controller="FirstCtrl"> <input type="text" ng-model="FirstName"><!– Input entered here –> <br>Input is : <strong>{{FirstName}}</strong><!– Successfully updates here –> </div> <hr> <div ng-controller="SecondCtrl"> Input should also be here: {{FirstName}}<!– How do I automatically updated it here? –> </div> JS // declare the app with no dependencies var myApp = angular.module('myApp', []); // […]

AngularJS:服务vs提供者vs工厂

AngularJS中的Service , Provider和Factory有什么区别?