Question

我有一个MVC5控制器，可以加载和对象并将其发送到View进行编辑。编辑表单视图有一个包含US状态的下拉控件，该控件绑定到一个名为包含状态数组的AngularJS Controller属性。

我想从View Model中设置AngularJS属性$ scope.SelectedState，以便下拉列表显示正确的状态。我找不到将MVC模型状态值干净地传递给AngularJS控制器属性的方法。感谢

$scope.SelectedState= {{I want to set this value from the MVC Model}};

HTML下面

  <label for="States" class="control-label col-md-2">States</label>
  <div class="controls col-md-4">
    <select ng-model="SelectedState" id="States" class="form-control" ng-options="st.abbreviation + ' - ' + st.name for st in States.USStates track by st.abbreviation">
      <option value="">-- Choose State --</option>
    </select>
    <input type="hidden" id="SelectedState" name="SelectedState" value="{{SelectedState}}" />
  </div>

以下是解决方案的Plunker demo：

Answer 1

在html中：<div ng-init="SelectedState = @(Model.SelectedState)"></div> 将@(Model.SelectedState)替换为MVC模型中的任何内容。我的例子是Razor。

Answer 2

<label for="States" class="control-label col-md-2">States</label>

    //convert your Model.State to Json and set States using ng-init
    <div class="controls col-md-4" ng-init="States = @Html.Raw(Json.Encode(Model.State))">
      <select ng-init=n g-model="SelectedState" id="States" class="form-control" ng-options="st.abbreviation + ' - ' + st.name for st in States.USStates track by st.abbreviation">
        <option value="">-- Choose State --</option>
      </select>
      <input type="hidden" id="SelectedState" name="SelectedState" value="{{SelectedState}}" />
    </div>

如何从MVC4 ActionResult设置AngularJs控制器属性

2 个答案: