Angular 自定义指令传参

<!DOCTYPE html>
<html ng-app="myApp">
<head lang="en">
  <meta charset="UTF-8">
  <script src="js/angular.js"></script>
  <title></title>
</head>
<body>

<div ng-controller="myCtrl">
</div>
<!--调用指令，并通过属性传参-->
<ts-directive ts-name="Hello World"></ts-directive>

<script>
  var app = angular.module('myApp', ['ng']);
  //创建指令
  app.directive('tsDirective', function () {
    return{
      template:'<h1>{{tsName}}</h1>',
      scope:{
        tsName:'@'//@取ts-name属性对应的值
      }
    }
  })

  app.controller('myCtrl', function () {
    console.log('myCtrl  func is called');
  })
</script>
</body>
</html>

巴特西

Angular 自定义指令传参

最新文章

热门文章