如何显示和编辑mvc ApplicationUser属性

时间:2015-07-25 19:28:03

标签: json asp.net-mvc angularjs asp.net-web-api2

我想用AngularJS和webapi显示和编辑ApplicationUser。 ApplicationUser模型具有默认属性IdentityRole以及与Company类的多对多关系。我希望能够使用带有复选框的表单来显示编辑每个用户。像这样的东西

我使用ApplicationUser,ApplicationRoles和Companies plunker

中的JSON编写了一个plunker
 Full Name : <input ng-model="FullName" type="text"/>
 Email : <input ng-model="Email" type="text"/>
 Role : 
       <ul ng-repeat="r in roles">
          <li>
            <input type="checkbox" ng-model="RoleId" /> {{RoleName}} 
          </li>
       </ul>
  Company(s) : 
       <ul ng-repeat="c in companies">
         <li>
           <input type="checkbox" ng-model="CompanyID" /> {{CompanyName}}
         </li>
      </ul>
  <input type="submit" value="Save" />

角度控制器

 ApplicationUser.query(function (data) {
            $scope.applicationUsers = data;
        });//



        //get single ApplicationUser
        $scope.editApplicationUser = function (id) {
            var deferred = $q.defer();
            $http({ method: 'get', url: '/api/ApplicationUsers/' + id })
                    .success(function (model) {
                        deferred.resolve(model);
                        $scope.model = model;
                    }).error(function (error) {
                        deferred.reject(error);
                    }).then(function () {
                        $modal.open({
                            templateUrl: "EditApplicationUserModal.html",
                            controller: "ModalInstanceController",
                            //size: 'lg',
                            resolve: {
                                model: function () {
                                    return $scope.model;
                                }
                            }
                        });
                    })
            return deferred.promise;
        }

        //update applicationUsers
        $scope.updateApplicationUser = function (model) {
            model = $scope.model;
            ApplicationUserUpdate.update(model).success(function (model) {

                $scope.close();
            }).error(function (err, result) {
                console.log(err, result);
            });
        };

身份模型

  public class ApplicationUser : IdentityUser
{
    public async Task<ClaimsIdentity>
        GenerateUserIdentityAsync(UserManager<ApplicationUser> manager)
    {
        var userIdentity = await manager
            .CreateIdentityAsync(this, DefaultAuthenticationTypes.ApplicationCookie);
        return userIdentity;
    }


    public ApplicationUser()
    {
        Companies = new List<Company>();
    }
    public virtual ICollection<Company> Companies { get; set; }
    public string FullName { get; set; }
    public string ProfilePicUrl { get; set; }
}


public class ApplicationRole : IdentityRole
{
    public ApplicationRole() : base() { }
    public ApplicationRole(string name) : base(name) { }
    public string Description { get; set; }

}


public class ApplicationDbContext : IdentityDbContext<ApplicationUser>
{
    public ApplicationDbContext()
        : base("DefaultConnection", throwIfV1Schema: false)
    {
    }

    static ApplicationDbContext()
    {
       // Database.SetInitializer<ApplicationDbContext>(new ApplicationDbInitializer());
    }

    public static ApplicationDbContext Create()
    {
        return new ApplicationDbContext();
    }



    protected override void OnModelCreating(DbModelBuilder modelBuilder)
    {
        modelBuilder.Entity<ApplicationUser>()
            .HasMany(up => up.Companies)
            .WithMany(company => company.ApplicationUsers)
            .Map(mc =>
            {
                mc.ToTable("T_ApplicationUser_Company");
                mc.MapLeftKey("Id");
                mc.MapRightKey("CompanyID");
            }
        );

        base.OnModelCreating(modelBuilder);
    }

公司模式

 public class Company
{
    public int CompanyID { get; set; }
    public string CompanyName { get; set; }


    public virtual ICollection<ApplicationUser> ApplicationUsers { get; set; }
}

1 个答案:

答案 0 :(得分:4)

公司根本没有被列出的原因是因为ng-repeat引用了companies,其范围为companys

这就是你需要的:

<ul ng-repeat="c in companys">
   <li><input type="checkbox" ng-model="CompanyID" /> {{c.CompanyName}}</li><br/><br/>
</ul>

未显示角色名称,因为r上的内部ng-repeat变量未被使用。需要:

<ul ng-repeat="r in roles">
   <li><input type="checkbox" ng-model="RoleId" /> {{r.Name}}</li><br/><br/>
</ul>