Question

更新：将帖子更改为更简化的示例。

http://jsfiddle.net/bphein1980/avfozhx4/1/

问题：当x-editable选项更改为＆＃34; option3＆＃34;并且$ scope.condition1value在$ scope.changeCondition1（）中设置为零（0）...为什么视图不反映新的condition1value值？

代码：

<div ng-app="myApp">
    <div ng-controller="testController">

        <form editable-form name="myForm">
            <button class="show" type="button" ng-show="!myForm.$visible" ng-click="myForm.$show()">Edit</button>
            <button class="done" type="submit" ng-show="myForm.$visible">Done</button>
        </form>

        <span 
            editable-select="condition1" 
            e-ng-options="c1.name as c1.name for c1 in condition1s" 
            e-ng-change="changeCondition1($data)"
            e-form="myForm"
            e-name="condition1"
        >
            {{ showCondition1() }}
        </span>

        <span editable-text="condition1value" e-ng-model="condition1value" e-name="condition1value" e-form="myForm"> 
            {{ condition1value }}
        </span>

    </div>
</div>

更多代码：

var myApp = angular.module("myApp", ["xeditable"]);

myApp.run(function(editableOptions, editableThemes) {
    editableOptions.theme = 'default'; 
});

myApp.controller("testController", ["$scope", "$filter", testController]);

function testController($scope, $filter) {

    $scope.condition1s = [
        { id: 1, name: "option1" },
        { id: 2, name: "option2" },
        { id: 3, name: "option3" }
    ];

    $scope.condition1 = "";
    $scope.condition1value = "20";

    $scope.changeCondition1 = function(newVal){
        if(newVal == 'option3'){
             $scope.condition1value = 0;   
        }
        console.log("changeCondition1", newVal, $scope);
    };

    $scope.showCondition1 = function(){
        var selected = $filter('filter')($scope.condition1s, { name: $scope.currentCondition1 });
        return ($scope.currentCondition1 && selected.length) ? selected[0].name : 'empty';        
    };

}

Answer 1

我能够找到解决方案。 Xeditable在编辑时创建自己的范围，然后在完成后将其复制回来。您可以直接编辑表单的范围。

这是一个工作样本： https://jsfiddle.net/bphein1980/0au7h389/

在小提琴视图中，编辑一行并将选择更改为“空”。将删除右侧文本字段中的值。

$scope.changeCondition2 = function(data, line){
    line.condition2 = data;
    if(data === ''){
        var editables = this.$form.$editables;
        for(var i=0; i<=editables.length-1; i++){
           if(editables[i].name == 'condition2value'){
               editables[i].scope.$data = ""; 
               break;
           }
        }
    }
};

这是帮助我找到解决方案的帖子： https://github.com/vitalets/angular-xeditable/issues/60

Answer 2

不确定你要问的是什么，但是你试过在你的控制器中调用一个$ watch来查看你正在收听的模型是空的还是空的那么它会设置所有正确的字段你需要它的方式？

你能用另一种方式说出这个问题，因为它对我来说并不合适。

角度x可编辑取消选择以清除文本输入不起作用

2 个答案: