码迷,mamicode.com
首页 > 其他好文 > 详细

angular

时间:2016-05-06 12:47:24      阅读:216      评论:0      收藏:0      [点我收藏+]

标签:

<div ng-controller="ParentCtrl as parent" class="ng-scope">
  {{ parent.data }}
  <div ng-controller="SiblingOneCtrl as sib1" class="ng-scope">
      {{ sib1.data }}
  </div>
</div>
app.controller(‘ParentCtrl‘,
  function ParentCtrl ($scope) {

  $scope.$broadcast(‘parent‘, ‘Some data‘); // going down!

});

app.controller(‘SiblingOneCtrl‘,
  function SiblingOneCtrl ($scope) {

  $scope.$on(‘parent‘, function (event, data) {
    console.log(data); // ‘Some data‘
  });

});
app.controller(‘ParentCtrl‘,
  function ParentCtrl ($scope) {

  $scope.$on(‘child‘, function (event, data) {
    console.log(data); // ‘Some data‘
  });

});

app.controller(‘SiblingOneCtrl‘,
  function SiblingOneCtrl ($scope) {

  $scope.$emit(‘child‘, ‘Some data‘); // going up!

});
<div ng-controller="ParentCtrl as parent" class="ng-scope">
  <div ng-controller="SiblingOneCtrl as sib1" class="ng-scope"></div>
  <div ng-controller="SiblingTwoCtrl as sib2" class="ng-scope"></div>
</div>
$scope.$parent.$broadcast(‘myevent‘, ‘Some data‘);
directive @ & = difference
<!doctype html>
<html ng-app="MyModule">
	<head>
		<meta charset="utf-8">
		<link rel="stylesheet" href="css/bootstrap-3.0.0/css/bootstrap.css">
	</head>
	<body>
		<div ng-controller="MyCtrl">
			<greeting greet="sayHello(name)"></greeting>
			<greeting greet="sayHello(name)"></greeting>
			<greeting greet="sayHello(name)"></greeting>
		</div>
	</body>
	<script src="framework/angular-1.3.0.14/angular.js"></script>
	<script src="ScopeAnd.js"></script>
</html>
var myModule = angular.module("MyModule", []);
myModule.controller(‘MyCtrl‘, [‘$scope‘, function($scope){
	$scope.sayHello=function(name){
		alert("Hello "+name);
	}
}])
myModule.directive("greeting", function() {
    return {
    	restrict:‘AE‘,
        scope:{
        	greet:‘&‘
        },
        template:‘<input type="text" ng-model="userName" /><br/>‘+
        		 ‘<button class="btn btn-default" ng-click="greet({name:userName})">Greeting</button><br/>‘
    }
});
<!doctype html>
<html ng-app="MyModule">
	<head>
		<meta charset="utf-8">
		<link rel="stylesheet" href="css/bootstrap-3.0.0/css/bootstrap.css">
	</head>
	<body>
		<div ng-controller="MyCtrl">
			<drink flavor="{{ctrlFlavor}}"></drink>
		</div>
	</body>
	<script src="framework/angular-1.3.0.14/angular.js"></script>
	<script src="ScopeAt.js"></script>
</html>
var myModule = angular.module("MyModule", []);
myModule.controller(‘MyCtrl‘, [‘$scope‘, function($scope){
	$scope.ctrlFlavor="百威";
}])
myModule.directive("drink", function() {
    return {
    	restrict:‘AE‘,
        scope:{
        	flavor:‘@‘
        },
        template:"<div>{{flavor}}</div>"
        // ,
        // link:function(scope,element,attrs){
        // 	scope.flavor=attrs.flavor;
        // }
    }
});
<!doctype html>
<html ng-app="MyModule">
	<head>
		<meta charset="utf-8">
		<link rel="stylesheet" href="css/bootstrap-3.0.0/css/bootstrap.css">
	</head>
	<body>
		<div ng-controller="MyCtrl">
			Ctrl:
			<br>
			<input type="text" ng-model="ctrlFlavor">
			<br>
			Directive:
			<br>
			<drink flavor="ctrlFlavor"></drink>
		</div>
	</body>
	<script src="framework/angular-1.3.0.14/angular.js"></script>
	<script src="ScopeEqual.js"></script>
</html>
var myModule = angular.module("MyModule", []);
myModule.controller(‘MyCtrl‘, [‘$scope‘, function($scope){
	$scope.ctrlFlavor="百威";
}])
myModule.directive("drink", function() {
    return {
    	restrict:‘AE‘,
        scope:{
        	flavor:‘=‘
        },
        template:‘<input type="text" ng-model="flavor"/>‘
    }
});

angular

标签:

原文地址:http://blog.csdn.net/junlin_tu/article/details/51329454

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!