AngularJS實現(xiàn)自定義指令與控制器數(shù)據(jù)交互的方法示例

更新時間：2017年06月19日 10:51:50 作者：一花一世界,一葉一乾坤

這篇文章主要介紹了AngularJS實現(xiàn)自定義指令與控制器數(shù)據(jù)交互的方法,結(jié)合具體實例形式分析了AngularJS自定義指令的實現(xiàn)以及與控制器數(shù)據(jù)交互的操作技巧,需要的朋友可以參考下

本文實例講述了AngularJS實現(xiàn)自定義指令與控制器數(shù)據(jù)交互的方法。分享給大家供大家參考，具體如下：

<!doctype html>
<html>
  <head>
    <meta charset="utf-8">
    <title>AngularJS自定義指令與控制器數(shù)據(jù)交互</title>
<!--    <script src="http://cdn.bootcss.com/angular.js/1.3.15/angular.js"></script>-->
    <script src="../../lib/angular/angular.js"></script>
    <script>
    angular.module('yyApp', [])
    .controller('yyHelloController', function($scope){
      $scope.data = {
        name: '張三'
      }
    })
    .controller('yyHelloController2', function($scope){
      $scope.data = {
        name: '李四'
      }
    })
    .directive('yyHello', function(){
      return{
        restrict: 'AE',
        replace: true,
        template: '<div name="{{data.name}}">你好,{{data.name}}</div>'
      };
    });
    </script>
  </head>
  <body ng-app='yyApp'>
    <yy-hello ng-controller='yyHelloController'></yy-hello>
    <div ng-controller='yyHelloController2'>
      <input type="text" ng-model='data.name'>
      <yy-hello></yy-hello>
    </div>
  </body>
</html>

更多關于AngularJS相關內(nèi)容感興趣的讀者可查看本站專題：《AngularJS指令操作技巧總結(jié)》、《AngularJS入門與進階教程》及《AngularJS MVC架構(gòu)總結(jié)》

希望本文所述對大家AngularJS程序設計有所幫助。

您可能感興趣的文章:

基于AngularJs select綁定數(shù)字類型的問題
今天小編就為大家分享一篇基于AngularJs select綁定數(shù)字類型的問題，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
2018-10-10
Angularjs 根據(jù)一個select的值去設置另一個select的值方法
今天小編就為大家分享一篇Angularjs 根據(jù)一個select的值去設置另一個select的值方法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
2018-08-08
AngularJS 與百度地圖的結(jié)合實例
這篇文章主要介紹了AngularJS 與百度地圖的結(jié)合實例的相關資料,需要的朋友可以參考下
2016-10-10
Angular 2 利用Router事件和Title實現(xiàn)動態(tài)頁面標題的方法
本篇文章主要介紹了Angular 2 利用Router事件和Title實現(xiàn)動態(tài)頁面標題的方法，具有一定的參考價值，有興趣的可以了解一下
2017-08-08
Angular4實現(xiàn)圖片上傳預覽路徑不安全的問題解決
這篇文章主要給大家介紹了關于Angular4實現(xiàn)圖片上傳預覽路徑不安全問題的解決方法，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面來一起學習學習吧。
2017-12-12
詳解使用angular-cli發(fā)布i18n多國語言Angular應用
這篇文章主要介紹了詳解使用angular-cli發(fā)布i18n多國語言Angular應用，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2017-05-05
Angular中的請求攔截的方法
我們的接口是單獨編寫的處理的，在實際的開發(fā)項目中，有眾多的接口，有些需要登陸憑證，有些不需要。一個一個接口處理不妥，我們是否可以考慮對請求進行攔截封裝，感興趣的可以了解一下
2022-04-04
angularjs實現(xiàn)table增加tr的方法
下面小編就為大家分享一篇angularjs實現(xiàn)table增加tr的方法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
2018-02-02
AngularJS入門教程之Scope(作用域)
本文主要介紹AngularJS Scope(作用域),這里對Score知識做了詳細介紹,并提供實例代碼,有需要的小伙伴可以參考下
2016-07-07
AngularJS中$http的交互問題
本篇文章主要介紹了AngularJS中$http的交互問題，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
2017-03-03