Question

我正在开发用户首选项页面，我决定使用AngularJS来控制数据的状态。

我想要实现的是一个显示当前用户设置的页面，允许用户编辑，取消更改或保存＆amp;如果他们愿意，可以提交更改。我已将标签和输入控件绑定到模型，以便当用户修改其电子邮件地址时，它会被正确反映出来。

顺便说一下，我的工作基于这个例子＃3：http://code.angularjs.org/1.0.0rc12/docs-1.0.0rc12/guide/forms

我的问题与页面的默认值有关。由于模型被定义为Javascript中的对象。在上面的链接中，可以在$scope.master= {};中设置默认值，除了我正在使用框架生成静态页面而不从我的服务器检索json对象之外，其工作正常。我的页面都是用嵌入式scala编写的，所以我访问值serveride。获取信息检索服务器端并转换为javascript可以访问的对象客户端的最佳方法是什么？

Answer 1

你有几个选择。我这样做的方法是将初始状态（通过WebSocket或其他东西）推送到Angular作为JSON，或让Angular通过HTTP调用将其从服务器中拉出来。

您也可以使用ng-init标签渲染页面来设置初始状态，但这种方式对我来说似乎很奇怪。

<div ng-controller="FormController" ng-init="formData = {}">
  <form>
     <input ng-model="formData.input1" ng-init="formData.input1 = 'initialValue'>
  </form>
</div>

Answer 2

我正在使用ASP.NET和Dapper-Dot-Net。我使用以下技术将我的数据导入页面，然后进入Angular范围。它应该可以很好地转移到您的环境中。

在服务器端的页面中定义一个DataTransferObject类，并使用一个名为DtoJson的公共字符串来保存类实例的序列化版本。

private class DataTransferObject{
  public User User;
  public List<Project> Projects
}

public string DtoJson;

var dto=new DataTransferObject();
var userName="however you get a username";
dto.User=User.Get(userName);  // I already have a User class
var sql="select * from projects where user_name=:UserName";
var p=new DynamicParameters();
p.Add(":UserId", dto.User.ID);
dto.Projects=Project.Query<Project>(sql, p);  // returns a list of Project

// I use json.net to convert the Dto to json and expose it as a public variable
var DtoJson=Json.Convert(dto);  // approximate syntax but you get the idea

在客户端，我在页面的顶部放置了一个脚本标记，并将DtoJson注入其中以使其进入全局范围
```
<script>var dto=<%=DtoJson%>;</script>
```
在我的页面底部，我有一个脚本src =＆＃34; pageName.js＆＃34;这是我的Angular控制器文件。在控制器里面我说
```
$scope.dto=dto;
console.log($scope.dto);
```
现在，在服务器端创建的json位于我的控制器范围内，我可以将数据绑定到{{dto.User.FIRST_NAME}}和{{dto.Projects [0]。 ID}} ng-repeat =＆＃34; for d in dto.Projects＆＃34;等

我希望这是有道理的。

彼得

AngularJS和嵌入式框架html

2 个答案: