2015-12-21 61 views
1

那麼,我正在做一個開關使用角材料開關,但它不是從它的初始狀態開始,你可以在圖片上看到。標籤旁邊是它的價值。角材料md開關與對象陣列

enter image description here

正如你所看到的,從一開始停用的開關啓動。

要開始,我從get請求中獲取結果,並將其放入數組中。

$scope.questions = []; 

我在圖片上顯示的值可能是錯誤或真實的。 在md-switch上,我直接引用了數組內部的屬性。

<tr ng-repeat="quest in questions"> 
    <td><md-switch ng-model="quest.status">{{quest.status}}</md-switch></td> 
</tr> 

如何設置交換機初始值?

這是一個Codepen測試。 http://codepen.io/anon/pen/BjzpNN

但這似乎是尷尬的壽。做我的例子它工作正常,但與我的開發環境,它不起作用。 這是我的數組的console.log,我使用$resource作爲get請求得到這個。

那麼,這是什麼問題?

編輯2: 更加尷尬的是,使用屬性ng-true-value和ng-false-value,交換機不會獲得初始狀態。 enter image description here

+0

您好Matheus,請您舉個例子嗎?JsFiddle/Codepen/etc。 –

+0

當然。給我一分鐘。 –

+0

似乎你自己解決了你的問題:-) –

回答

3

我更新了下面的JavaScript,以使用服務獲取結果。不過,我只是從樣本中返回硬編碼的數據。你應該改變服務去獲取你的數據。該服務將用作承諾,並在完成時返回。

(function(){ 
    var app = angular.module('test', ['ngMaterial']) 
    .service('testService', function() { 
    // This should be modifed to then call your external API to get the data instead of hard coded results 
     var questions = [ 
      { name : "teste", status : true}, 
      { name : "teste2", status : false}, 
      { name : "teste3", status : true} 
     ]; 
     return questions;  
    }) 
    .controller('testController', ['$scope', 'testService', function($scope, testService) { 
     $scope.questions = []; 

     $scope.questions = testService;  // Use service to get data, will update questions when promise returns. 
    }]); 
}()) 

沒有檢查數據加載,因此在服務返回數據之前,您的屏幕將爲空。但是,當服務返回數據時,應該更新您的視圖。

正如CodePen所顯示的那樣,您不需要ng-true-value/ng-false-value,只需要ng-model列出字段以從中獲取設置。 ng-true-value是您切換開關時要設置的值(Angular md-switch docs如果您想要某些與True/False不同的值(比如A/B)

如果您需要,您可能還需要使用ng-disabled想要保護開關不會發生變化

+0

您可以使用此服務來返回一個http請求嗎? – pascalallen

+1

是的,該服務會從http請求中返回您的數據。該服務將返回數據,然後控制器將其映射到字段中以供在頁面上顯示。有很多的例子,例如http://stackoverflow.com/questions/12505760/processing-http-response-in-service。 –

+0

因此,我正在使用控制器內的服務,但是如何從數據庫創建服務更新數據? http://stackoverflow.com/questions/40385946/use-angularjs-mdswitch-directive-to-toggle-values-in-mysql – pascalallen