Question

我有一个由angularjs和相关控制器处理的2个选项。

如果第二个选择取决于第一个选择中的用户选择，则选择

我有这段代码，如下：

                <tr>
                    <td>
                        Stade<br/>
                        <select data-ng-options="s.displayName for s in stages" 
                                data-ng-model="accidentSearchSelectedStage"
                                onChange="javascript:getAccidentsModel(this)"
                                >
                        </select>
                    </td>
                </tr>
                <tr>
                    <td>
                        Organe<br/>
                        <select data-ng-options="o.displayName for o in organs | filter:accidentsSearch(accidentSearchSelectedStage, null, null, accidentsDiagnosticsMenu)" 
                                data-ng-model="accidentSearchSelectedOrgan"
                                onChange="javascript:getAccidentsModel(this)"
                                >
                        </select>
                    </td>
                </tr>

编辑1：添加了过滤器代码段

$scope.accidentsSearch = function( stage, organ, symptom, accidentsDiagnosticsMenu ) {

    if (organ==null && symptom ==null) {
        console.log("------>filter organs for criteria stage: "+stage.displayName+", "+organ+", "+symptom);

        return function( organToCheck ) {
            if (!accidentsDiagnosticsMenu) return false;    // not yet prepared

            organToCheck =  organToCheck.displayName;
            var pruned = accidentsDiagnosticsMenu[stage.displayName];
            //console.log("Exploring pruned with "+stage.displayName+": "+JSON.stringify(pruned));

            for (var o in pruned) {
                // Find one with same organs?
                var keep = (o == organToCheck);
                if (keep) {
                    //console.log("Checking organs "+o+"=="+organToCheck+" for stage "+ stage.displayName+ ", so keep = "+keep);
                    return true;
                }
            }
            return false;
        };
    }
    else
    if (symptom == null) {
        console.log("------>filter for criteria stage/organ : "+stage.displayName+", "+organ.displayName+", "+symptom);
        return function(symptomToCheck ) {

Q1）这很好用，除非它有时在第二个选择中选择一个空的附加选项，具体取决于之前选择的值。

如何解决这个问题？

Q2）我需要在进行新选择时随时执行旧版javascript代码。是＆＃39; onchange＆＃39;归因于正确的方法，还是有一种angularjs方法呢？

编辑2：$ watch path exploration

我在连接到每个选择的模型上探索了一个带有$ watch的解决方案，如下所示：

$scope.$watch('accidentSearchSelectedStage', function (newValue, oldValue) {
    console.log("accidentSearchSelectedStage changed from "+oldValue.id+" to "+newValue.id);
});

$scope.$watch('accidentSearchSelectedOrgan', function (newValue, oldValue) {
    console.log("accidentSearchSelectedOrgan changed from "+oldValue.id+" to "+newValue.id);
    //$scope.accidentSearchSelectedSymptom = $scope.symptoms[0];
});

日志还可以，但由于以下两个原因我暂时陷入困境：

选择说阶段和之间的时间图是什么？过滤器的执行？
检查的位置和方式器官和症状的价值是在哪里？

Answer 1

如果模型设置为可用选项以外的其他选项，select指令将自动为该值创建一个选项。否则它不知道应该选择哪一个。理论上它可能是第一个，但我确定Angular家伙有充分理由这样做。

无论如何，您基本上只需要在控制器中引导数据，以确保如果它没有有效选项，只需将其设置为默认选项。

E.g。

var data = getDataFromSomeSource();
var validOptions = ['foo','bar','default'];
if(validOptions.indexOf(data.option) < 0) {
    data.option = 'default';
}

RE：＃2 - onchange可能是现在最简单的方法，如果这只是暂时的，那么添加额外的/不必要的非角度代码是没有意义的，直到你将所有内容移植完毕。

如何确保模型在选项边界内？

1 个答案: