javascript - Angular ng-options 不是由模型设置的

Question

我有一个 Angular View ，用户可以在其中选择一个选项。 (select的数据来自API，所以它是JSON对象)。

这是我的选择之一(不要看我的对象的结构):

<select ng-options="team.logo as team.logo.title for team in teams"
        ng-model="live.metadata.teams.home.infos"
        class="form-control">
</select>

在我的 Controller 中，我有一个空模型，当客户端选择新选项时，该模型已设置好。

通过 select 存储在模型中的值是一个带有 id、标题等的 JSON 对象。

在此 View 中，客户可以创建一个团队并且一切正常。当客户想要编辑其团队之一时，就会出现问题。

我使用 ng-options 进行了完全相同的选择(在另一种状态下，[前一个 View 的兄弟]“编辑”为例)，但是这次模型不是空的(它包含最近的 JSON 对象)创建了具有完全相同结构的团队)。所以我希望选择采用模型的值，例如在选择中显示名称。

但是什么也没有出现。选择似乎与模型断开连接，但是当您在选择中选择另一个选项时，它会很好地更改模型，因此 ng-options 和 ng-model 可以很好地同步。

我不知道它从哪里来......

(我猜这不是子作用域的问题，我测试了它，没有任何改变)。

以下是 API 给出的对象示例:

{
    logo: {
        nid: "71",
        title: "Team Name 1",
        type: "team",
        logo: {
            src: "imageURL",
            alt: ""
        }
    }
},
{
    logo: {
        nid: "72",
        title: "Team Name 2",
        type: "team",
        logo: {
            src: "imageURL",
            alt: ""
        }
    }
}

Answer 1

问题是默认情况下 Angular 通过引用监视模型。为了克服这个问题，可以使用track by。由于嵌套对象(请参阅 select as and track by documentation )，它对您不起作用，为了解决此问题，我已将“ Logo ”选择到另一个数组中。

这是工作演示 https://jsfiddle.net/1a7s9xqb/