2016-02-22 34 views
0

我正在使用Angular Xeditable api.I需要根據下拉式的值更改文本字段的值。但它不起作用。您能告訴我爲什麼嗎?謝謝。Angular Xeditable下拉式e-ng-change無法正常工作

的Html

<td> 
<span editable-select="user.status" e-form="tableform" e-ng-options="s.value as s.text for s in statuses" e-ng-change="setName($data,user)"> 
    {{ showStatus(user) }} 
</span> 
</td> 

JS

$scope.setName = function (id, user) { 
       var selected = []; 
       if (id) { 
        selected = $filter('filter')($scope.statuses, { value: id }); 
       } 

       if (selected.length) { 
        user.name = selected[0].text; 
       } 
      }; 

生成的HTML:你可以看到,它已被更改申請如預期(STATUS3)這個名字的文字。但它不正確地更新文本框。換句話說,它不顯示在文本框中。爲什麼?

<td> 
    <!-- editable username (text with validation) --> 
<span editable-text="user.name" e-form="tableform" onbeforesave="checkName($data, user.id)" class="ng-scope ng-binding editable editable-hide"> 
      status3 
    </span><span class="editable-wrap editable-text ng-scope"><div class="editable-controls form-group" ng-class="{'has-error': $error}"><input type="text" class="editable-input form-control ng-pristine ng-valid" ng-model="$data"><div class="editable-error help-block ng-binding" ng-show="$error" ng-bind="$error" style="display: none;"></div></div></span> 
</td> 

UPDATE:

我試圖像this.But然後它改變了所有行values.So我怎麼能只檢測更改的行?

$scope.setName = function (id, user,form) { 
       var selected = []; 
       if (id) { 
        selected = $filter('filter')($scope.statuses, { value: id }); 
       } 

       if (selected.length) { 
        for (var i = 0; i < form.$editables.length; i++) { 
         if (form.$editables[i].name === 'user.name') { 
          form.$editables[i].scope.$data ="sampath"        
         } 
         } 
       } 
      }; 

這裏是JsFiddle

回答

1

我嘗試使用舊的源代碼和它的作品對我來說:

if (selected.length) { 
    user.name = selected[0].text; 
} 

可能是我錯過理解您的問題。

http://jsfiddle.net/NfPcH/14573/

1

如果我的理解是正確的,你只是想根據狀態變化來更新文本框(被綁定到用戶的名字)的文本,對不對?

如果是這樣,那麼你的UPDATED代碼太複雜了。只需在傳遞給setName函數的用戶對象上直接更新屬性(就像在第一個示例中那樣)。它已經綁定到了文本框,所以你不必一路走來直接更新文本框。這就是使用角度的全部要點。您更新示波器上的模型,其餘部分自動發生。

$scope.setName = function (id, user) { 
    if (!id || !user) { 
     // Do something to handle this... 
     return; 
    } 
    var selected = $filter('filter')($scope.statuses, { value: id }); 
    selected = selected.length ? selected[0] : null; 
    user.name = 'sampath (' + selected.text + ')'; 
}; 

這裏是一個udpated小提琴: http://jsfiddle.net/NfPcH/14765/