我试图弄清楚角度基数是否会自动解除观察者和范围事件的约束,$scope.$on(...)或者$scope.$watch(...)当范围被破坏时？
假设我有以下代码:
$scope.$on('someEvents', handleSomeEvent);
$scope.$watch('someProperty', handleSomePropertyChange);
在范围内触发$ destroy事件时,是否需要手动取消绑定这些观察者和事件？
我遇到了一个我无法调试的错误.
外形field.html
<div class='row form-group' ng-form="{{field}}" ng-class="{ 'has-error': {{field}}.$dirty && {{field}}.$invalid }">
<label class='col-sm-2 control-label'> {{ field | labelCase }} <span ng-if='required'>*</span></label>
<div class='col-sm-6' ng-switch='required'>
<input ng-switch-when='true' ng-model='record[field][0]' type='{{record[field][1]}}' class='form-control' required ng-change='update()' ng-blur='blurUpdate()' />
<div class='input-group' ng-switch-default>
<input ng-model='record[field][0]' type='{{record[field][1]}}' class='form-control' ng-change='update()' ng-blur='blurUpdate()' />
<span class='input-group-btn'>
<button class='btn btn-default' ng-click='remove(field)'><span class='glyphicon glyphicon-remove-circle'></span></button>
</span>
</div>
</div>
<div class='col-sm-4 has-error' ng-show='{{field}}.$dirty && {{field}}.$invalid' ng-messages='{{field}}.$error'>
<p class='control-label' ng-message='required'> {{ field | labelCase }} is required. </p>
<p class='control-label' ng-repeat='(k, v) in types' ng-message='{{k}}'> …我正在尝试使用ng-click附加到更新我的模型<p>.
我有一个赋值表达式没有问题外的ng-repeat,或者与调用方法的范围内的ng-repeat.不过,如果我使用赋值里面的ng-repeat,它似乎被忽略.我没有在Firefox控制台中看到任何消息报告,但是没有尝试设置断点以查看事件是否被触发.
<!DOCTYPE html>
<html>
<head>
<title>Test of ng-click</title>
<script type='text/javascript' src='http://code.angularjs.org/1.1.1/angular.js'></script>
<script type='text/javascript'>//<![CDATA[
function MyCtrl($scope) {
$scope.selected = "";
$scope.defaultValue = "test";
$scope.values = ["foo", "bar", "baz"];
$scope.doSelect = function(val) {
$scope.selected = val;
}
}
//]]>
</script>
</head>
<body ng-app>
<div ng-controller='MyCtrl'>
<p>Selected = {{selected}}</p>
<hr/>
<p ng-click='selected = defaultValue'>Click me</p>
<hr/>
<p ng-repeat='value in values' ng-click='selected = value'>{{value}}</p>
<hr/>
<p ng-repeat='value …以下angular.ui模态示例显示modalInstance调用a ModalIntanceCtrl,稍后将其创建为函数:
var ModalDemoCtrl = function ($scope, $modal, $log) {
$scope.items = ['item1', 'item2', 'item3'];
$scope.open = function () {
var modalInstance = $modal.open({
templateUrl: 'myModalContent.html',
controller: ModalInstanceCtrl,
resolve: {
items: function () {
return $scope.items;
}
}
});
modalInstance.result.then(function (selectedItem) {
$scope.selected = selectedItem;
}, function () {
$log.info('Modal dismissed at: ' + new Date());
});
};
};
var ModalInstanceCtrl = function ($scope, $modalInstance, items) {
$scope.items = items;
$scope.selected = {
item: $scope.items[0] …我有一个从JSON文件中检索数据的服务.
数据中的一些数据全部为大写,例如:
$scope.FootballClubs = [{
CompanyName: [MANCHESTER UNITED, LIVERPOOL FOOTBALL CLUB, CHELSEA, WIGAN UNTIED, LEICESTER CITY]
}];
在我的HTML中,我只是抛出上述内容:
<div ng-repeat="name in FootballClubs">
{{ name.CompanyName }}
</div>
抛出:
MANCHESTER UNITED
LIVERPOOL FOOTBALL CLUB
CHELSEA
WIGAN UNTIED
LEICESTER CITY
我想要展示的是:
Manchester United
Liverpool Football Club
Chelsea
Wigan United
Leicester City
angularjs angularjs-directive angularjs-scope angularjs-ng-repeat
我有一个简单的ng-repeat抛出数据,它显示的字段之一是NumberOfStamps:
<tr ng-repeat-start="list in Data.Items ">
<td><a href=" {[{list.Title}]} {[{list.ForeName}]} {[{list.SurName}]}</a></td>
<td>(Date of Birth {[{list.Dob}]})</td>
<td>{[{list.NumberOfStamps}]} stamps</td>
</tr>
示例输出:
Mr Adam Happy Date of Birth 01/6/1984 16 stamps
Mr Adam Sad Date of Birth 24/11/1975 0 stamps
Mr Adam Green Date of Birth 02/1/1963 1 stamps
Mr Adam Red Date of Birth 21/1/1951 12 stamps
Mr Adam Blue Date of Birth 28/10/1998 0 stamps
Mr Adam Brown Date of Birth 25/9/2010 0 stamps
Mr Adam Black Date of Birth 24/8/1954 …angularjs angularjs-directive angularjs-scope angularjs-ng-repeat
我需要从指令中的父控制器继承范围.我不一定要留下范围:false.我也不一定想要使用隔离范围,因为它需要大量的工作才能使我关心的值正确链接(在父控制器中考虑很多值).
scope:true如果我想更新父范围,在我的指令中使用是否有意义？
<div ng-controller="MyCtrl">
Hello, {{name}}!
<my-directive></my-directive>
</div>
var myApp = angular.module('myApp',[]);
//myApp.directive('myDirective', function() {});
//myApp.factory('myService', function() {});
function MyCtrl($scope) {
$scope.name = 'Dave';
}
myApp.directive('myDirective', function() {
return {
scope: true,
restrict: 'EA',
link: function(scope, elem, attrs) {
scope.updateName = function(newName) {
console.log('newName is: ' + newName);
scope.name = newName;
}
},
template: '<input ng-model="updatedName" placeholder="new name value"> <button ng-click="updateName(updatedName)">Update</button>'
}
})
请查看小提琴
请参见此处:http://www.johnpapa.net/angularjss-controller-as-and-the-vm-variable/
正如标题所示,我正在按照本教程[ http://tech.pro/tutorial/1473/getting-started-with-angularjs-unit-testing]来设置单元测试,除了事实之外一切都很好我似乎无法访问vm变量作为我的$ scope.
dashboard.js
var controllerId = 'dashboard';
angular.module('app')
.controller(controllerId, ['common', 'datacontext', dashboard]);
function dashboard(common, datacontext) {
var getLogFn = common.logger.getLogFn;
var log = getLogFn(controllerId);
var vm = this;
vm.title = 'Dashboard';
dashboard.Spec.js
describe("app module", function() {
beforeEach(module("app"));
describe("dashboard", function() {
var scope,
controller;
beforeEach(inject(function($rootScope, $controller) {
scope = $rootScope.$new();
controller = $controller;
}));
it("should assign Dashboard as title", function() {
controller("dashboard", {
$scope: scope
});
expect(scope.title).toBe("Dashboard");
});
});
});
我试过的:当我在控制器依赖项中直接命名'$ scope'并为其设置"title"属性时,它可以工作(测试通过).但是,我想保持模式不变. …
我想绑定/设置一些布尔属性到指令.但我真的不知道如何做到这一点并实现以下行为.
想象一下,我想为结构设置一个标志,假设一个列表是可折叠的.我有以下HTML代码:
<list items="list.items" name="My list" collapsable="true"></list>
items双向绑定,name只是一个属性
我希望collapsable通过传递一个值(true,false或其他),或者双向绑定,在列表的$ scope中提供该属性
<list items="list.items" name="{{list.name}}" collapsable="list.collapsed"></list>
我正在开发一些UI组件,我想提供多种与它们交互的方式.也许,随着时间的推移,有些人想通过将对象的属性传递给属性来了解该组件的状态,或者是否已折叠.
有没有办法实现这个目标？如果我错过了什么或者我错了,请纠正我.
谢谢
我有这个:
app.controller('foo1', function ($scope) {
$scope.bar = 'foo';
});
app.controller('foo2', function ($scope) {
// want to access the $scope of foo1 here, to access bar
});
我怎么做到这一点？