2016-02-12 51 views
0

我想創建一個使用angularJs的表單,我有一些整數類型的屬性。以angularJS形式更新整數值的屬性的最佳方法是什麼?

例如,我有一個名爲admin_events的變量,它有3個值0,1,2來指示用戶訪問不同文件的權限/權限。數字0表示沒有權利,1表示僅查看,2表示完全正確。 現在我想創建一個表單來編輯管理員的這個屬性。 我該如何去做這件事? 我正在考慮使用angularJs來創建3個單選按鈕/複選框1,2和3,以便管理員只需單擊該選項即可更新屬性。

任何人有什麼建議是最好的辦法做到這一點?

+0

我個人會使用ng-options進行下拉菜單,您可以根據值 – stackg91

+0

顯示文本,但是我有一個關於ng-options的問題,我不能使用它,因爲我的admin_event只是一個包含整數值的變量,它不是一個3整數的數組。所以我不能在admin_event中重複這些選項。 – leo277

回答

0

這是一種可能的方法。請參閱行內註釋以解釋。

app.controller('MainCtrl', function($scope, $filter) { 

    // set up your model 
    $scope.allPermissions = [ 
    { "id" : 3, "name" : "ADMIN", selected: false }, 
    { "id" : 2, "name" : "READ", selected: false }, 
    { "id" : 1, "name" : "WRITE", selected: false } ]; 

    // Use $watch to detect changes in the model. 
    // But you might as well want to call this from an event or whatever... 
    $scope.$watch('allPermissions', function(newval, oldval){ 
     if (oldval != newval) 
     { 
      // only return the checked values using $filter 
      var selectedPermission = $filter('filter')($scope.allPermissions, {selected: true}); 

      // 'selectedPermission' will return a list of all selected permissions. 
      // Use 'selectedPermission[0].id' to return the first value. 
      $scope.admin_events = selectedPermission[0].id; 

     } 
    },true); 

}); 

而在你的HTML

<body ng-controller="MainCtrl"> 
<p ng-repeat="permission in allPermissions"> 
     <input type="checkbox" ng-model="permission.selected"/> 
     {{permission.name}} 
    </p> 
    admin_events: {{admin_events}} 

</body> 
+0

好的,我試過了。它看起來不錯,但是可能只限制1次複選框在任何時候被檢查。 – leo277

0

最後,我決定用一個範圍類型的輸入來實現選擇。實施起來要容易得多。

<input ng-model= "user.activities.events" name="activities.events" type="range" max="2" min="0" class="form-control"> 

但我認爲@ sjokkogutten的答案也不錯。但是複選框並不是互斥的。無論如何感謝@sjokkogutten。

相關問題