使用此角度定義功能

我正在學習角度並嘗試使用控制器，但ng-click不起作用（該函數未被調用）。 Chrome擴展Batarang表示該函數被定義爲null，爲什麼？使用此角度定義功能

angular.module('starter', ['ionic']) 
 

 
.run(function ($ionicPlatform) { 
 
    $ionicPlatform.ready(function() { 
 
     // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard 
 
     // for form inputs) 
 
     if (window.cordova && window.cordova.plugins.Keyboard) { 
 
      cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true); 
 
     } 
 
     if (window.StatusBar) { 
 
      StatusBar.styleDefault(); 
 
     } 
 
    }); 
 
}) 
 

 

 
.controller("TodoControl", function Controller() { 
 
    var thisRef = this; 
 

 
    this.todos = [ 
 
     { 
 
      text: "mein todo 1", 
 
      done: false 
 
     }, 
 
     { 
 
      text: "mein todo 2", 
 
      done: true 
 
     } 
 
    ]; 
 

 
    this.newEntry = "hallo"; 
 

 
    this.AddEntry = function() { 
 
     console.log("adding"); 
 
     thisRef.todos.push({ 
 
      text: this.newEntry, 
 
      done: false 
 
     }); 
 
     thisRef.newEntry = ""; 
 
    } 
 

 
});

<body ng-app="starter"> 
 

 
    <ion-pane> 
 
     <ion-header-bar class="bar-stable"> 
 
      <h1 class="title">Ionic Blank Starter</h1> 
 
     </ion-header-bar> 
 
     <ion-content> 
 
      <div ng-controller="TodoControl as ctr" class="container"> 
 
       <form role="form"> 
 
        <div class="form-group" ng-repeat="t in ctr.todos"> 
 
         <div class="checkbox"> 
 
          <label class="checkbox-inline"> 
 
           <input class="form-control todoFormControl" type="checkbox" ng-model="t.done"><span>{{t.text}}</span></label> 
 

 

 
         </div> 
 
        </div> 
 
       </form> 
 
       
 
       
 
       <label><input class="todoNewTaskIn" type="text" placeholder="New Task" value="{{ctr.newEntry}}" Style="border: 1px solid gray;" ><button class="button" ng-click="ctr.AddEntry()">Add</button></label> 
 
       
 
      </div> 
 
     </ion-content> 
 
    </ion-pane> 
 
</body>

這是離子的應用（這樣的離子包括角被包括）

編輯：這裏一個js小提琴：http://jsfiddle.net/duowfLsn/

來源

2015-05-12 Peter Burkert

把它掛在它會運行一個地方，的jsfiddle例如 –

什麼是HTML文件？ – ABOS

http://jsfiddle.net/duowfLsn/ @ patrick-reck –

移動您的按鈕出部分的和它應該工作。更新你的榜樣

<label> 
<input class="todoNewTaskIn" type="text" placeholder="New Task" value="{{ctr.newEntry}}" Style="border: 1px solid gray;" > 
<button class="button" ng-click="ctr.AddEntry()">Add</button> 
</label>

成爲

<label> 
<input class="todoNewTaskIn" type="text" placeholder="New Task" value="{{ctr.newEntry}}" Style="border: 1px solid gray;" /> 
</label> 
<button class="button" ng-click="ctr.addEntry()">Add</button>

http://jsfiddle.net/duowfLsn/3/

來源

2015-05-12 20:29:10 domitall

非常感謝！你也知道它爲什麼起作用嗎？ –

我不確定，不想說這是答案，但標籤具有點擊行爲 - 如果您使用標籤的「for」屬性，當您單擊標籤時，id'd元素將突出顯示（例如作爲文本框）。正因爲如此，也許標籤點擊攔截和按鈕點擊從不觸發？ –

使用此角度定義功能

回答

相關問題