無法點擊列表中的按鈕（ng-repeat）

我遇到列表中的按鈕有問題。該名單正在建造中ng-repeat。我正在嘗試創建一個簡單的Web應用程序來創建任務。給定以下代碼，我無法點擊應該顯示任務描述的按鈕（帶齒輪的按鈕）。先謝謝你。無法點擊列表中的按鈕（ng-repeat）

HTML：

<html> 
    <head> 
    <meta charset="utf-8"> 
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width"> 
    <title>Tasks List</title> 

    <link rel="manifest" href="manifest.json"> 

    <!-- un-comment this code to enable service worker 
    <script> 
     if ('serviceWorker' in navigator) { 
     navigator.serviceWorker.register('service-worker.js') 
      .then(() => console.log('service worker installed')) 
      .catch(err => console.log('Error', err)); 
     } 
    </script>--> 

    <link href="lib/ionic/css/ionic.css" rel="stylesheet"> 
    <link href="css/style.css" rel="stylesheet"> 

    <!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above 
    <link href="css/ionic.app.css" rel="stylesheet"> 
    --> 

    <!-- ionic/angularjs js --> 
    <script src="lib/ionic/js/ionic.bundle.js"></script> 

    <!-- cordova script (this will be a 404 during development) --> 
    <script src="cordova.js"></script> 

    <!-- your app's js --> 
    <script src="js/app.js"></script> 
    </head> 





    <body ng-app="todo" ng-controller='mainCtrl'> 
    <ion-pane> 
     <ion-header-bar class="bar-dark"> 
     <h1 class="title">Tasks</h1> 
     </ion-header-bar> 
     <ion-content> 
     <div class="list list-inset"> 
      <label class="item item-input"> 
      <input type="text" name="list" placeholder="Task Name" ng-model="task"> 
      </label> 
      <label class="item item-input"> 
      <input type="text" placeholder="Description" ng-model="description"> 
      </label> 
     </div> 

     <button class ="button button-dark right" ng-click="add(task,description)">Add</button> 

      <div class="row"> 
      <div class="col"></div> 
      <div class="col"></div> 
      <div class="col col-50"> 

       <ion-list show-delete="1==1" ng-repeat="task in tasks"> 
       <ion-item> 
        {{task.taskname}} 
        <ion-delete-button class="ion-minus-circled" ng-click="delete(task)"></ion-delete-button> 
        <button ng-click="task.selected=!task.selected" class="btn button icon ion-gear-a"></button> 
       </ion-item> 

       <div class="item item-divider" ng-show="task.selected"> 
       {{task.description}} 
       </div> 
       </ion-list> 
      </div> 
      </div> 



     </ion-content> 
    </ion-pane> 
    </body> 
</html>

app.js：

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

.controller('mainCtrl',function($scope, $ionicModal){ 
    $scope.tasks=[ 
{ 
    taskname: 'Hi', 
    description:'I am a description', 
    selected: false 
}, 
{ 
    taskname:'Hello', 
    description:'I am another description', 
    selected: false 
}, 
{ 
    taskname: '123', 
    description:'I am another description', 
    selected: false 
}, 
{ 
    taskname: '456', 
    description:'I am another description', 
    selected: false 
}, 
{ 
    taskname: '789', 
    description:'I am another description', 
    selected: false 
}, 
    ] 

    $scope.select=-1; 

    $scope.add=function(task,description){ 
     if ($scope.tasks.indexOf(task)!== -1){ 
     this.list="Already exists!" 
     } 
else{ 
    newtask={ 
    taskname: task, 
    description: description, 
    selected: false 
    }; 

    $scope.tasks.push(newtask); 

    } 
    }; 

$scope.delete=function(task){ 
    var index = $scope.tasks.indexOf(task); 
    $scope.tasks.splice(index, 1); 

} 


});

來源

2017-03-07 Sebastian Herrera

您是否嘗試過使用[ion-button]（https://ionicframework.com/docs/v2/api/components/button/Button/） – alphapilgrim

yes，doenst work。它就像一些東西在按鈕上，我不能點擊它，如果我把按鈕放在ng-repeat之外，我可以點擊它。 –

我會嘗試做不重複的離子項目不在列表指令本身像文檔。 – alphapilgrim

你控制線應該是：

.controller('mainCtrl', ['$scope', '$ionicModal', function($scope, $ionicModal) {

而且很明顯在年底額外的。

來源

2017-03-07 13:45:46 rrd

感謝您的幫助，但我仍然無法點擊齒輪按鈕。任何其他想法？ –

您是否嘗試過使用

不，不工作。似乎列表是在按鈕上，這就是爲什麼我不能點擊它。我不知道如何解決這個問題 –

我刪除了ios-list和ion-item標籤，並將它們替換爲ul和li標籤，並且它工作完美，這些標籤有什麼問題嗎？

來源

2017-03-07 14:18:01

無法點擊列表中的按鈕（ng-repeat）

回答

相關問題