欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

如何使用AngularJs打造權(quán)限管理系統(tǒng)【簡(jiǎn)易型】

 更新時(shí)間:2016年05月09日 12:18:46   作者:Learning hard  
這篇文章主要介紹了使用AngularJs打造權(quán)限管理系統(tǒng)【簡(jiǎn)易型】的相關(guān)資料,需要的朋友可以參考下

一、引言

  本文將介紹如何把AngularJs應(yīng)用到實(shí)際項(xiàng)目中。本篇文章將使用AngularJS來(lái)打造一個(gè)簡(jiǎn)易的權(quán)限管理系統(tǒng)。下面不多說(shuō),直接進(jìn)入主題。

二、整體架構(gòu)設(shè)計(jì)介紹

  首先看下整個(gè)項(xiàng)目的架構(gòu)設(shè)計(jì)圖:

  從上圖可以看出整個(gè)項(xiàng)目的一個(gè)整體結(jié)構(gòu),接下來(lái),我來(lái)詳細(xì)介紹了項(xiàng)目的整體架構(gòu):

  采用Asp.net Web API來(lái)實(shí)現(xiàn)REST 服務(wù)。這樣的實(shí)現(xiàn)方式,已達(dá)到后端服務(wù)的公用、分別部署和更好地?cái)U(kuò)展。Web層依賴應(yīng)用服務(wù)接口,并且使用Castle Windsor實(shí)現(xiàn)依賴注入。

顯示層(用戶UI)

  顯示層采用了AngularJS來(lái)實(shí)現(xiàn)的SPA頁(yè)面。所有的頁(yè)面數(shù)據(jù)都是異步加載和局部刷新,這樣的實(shí)現(xiàn)將會(huì)有更好的用戶體驗(yàn)。

應(yīng)用層(Application Service)

  AngularJS通過(guò)Http服務(wù)去請(qǐng)求Web API來(lái)獲得數(shù)據(jù),而Web API的實(shí)現(xiàn)則是調(diào)用應(yīng)用層來(lái)請(qǐng)求數(shù)據(jù)。

基礎(chǔ)架構(gòu)層

  基礎(chǔ)架構(gòu)層包括倉(cāng)儲(chǔ)的實(shí)現(xiàn)和一些公用方法的實(shí)現(xiàn)。

  倉(cāng)儲(chǔ)層的實(shí)現(xiàn)采用EF Code First的方式來(lái)實(shí)現(xiàn)的,并使用EF Migration的方式來(lái)創(chuàng)建數(shù)據(jù)庫(kù)和更新數(shù)據(jù)庫(kù)。

  LH.Common層實(shí)現(xiàn)了一些公用的方法,如日志幫助類、表達(dá)式樹(shù)擴(kuò)展等類的實(shí)現(xiàn)。

領(lǐng)域?qū)?/strong>

  領(lǐng)域?qū)又饕獙?shí)現(xiàn)了該項(xiàng)目的所有領(lǐng)域模型,其中包括領(lǐng)域模型的實(shí)現(xiàn)和倉(cāng)儲(chǔ)接口的定義。

  介紹完整體結(jié)構(gòu)外,接下來(lái)將分別介紹該項(xiàng)目的后端服務(wù)實(shí)現(xiàn)和Web前端的實(shí)現(xiàn)。

三、后端服務(wù)實(shí)現(xiàn)

  后端服務(wù)主要采用Asp.net Web API來(lái)實(shí)現(xiàn)后端服務(wù),并且采用Castle Windsor來(lái)完成依賴注入。

  這里拿權(quán)限管理中的用戶管理來(lái)介紹Rest Web API服務(wù)的實(shí)現(xiàn)。

提供用戶數(shù)據(jù)的REST服務(wù)的實(shí)現(xiàn):

public class UserController : ApiController
 {
  private readonly IUserService _userService;
  public UserController(IUserService userService)
  {
   _userService = userService;
  }
  [HttpGet]
  [Route("api/user/GetUsers")]
  public OutputBase GetUsers([FromUri]PageInput input)
  {
   return _userService.GetUsers(input);
  }
  [HttpGet]
  [Route("api/user/UserInfo")]
  public OutputBase GetUserInfo(int id)
  {
   return _userService.GetUser(id);
  }
  [HttpPost]
  [Route("api/user/AddUser")]
  public OutputBase CreateUser([FromBody] UserDto userDto)
  {
   return _userService.AddUser(userDto);
  }
  [HttpPost]
  [Route("api/user/UpdateUser")]
  public OutputBase UpdateUser([FromBody] UserDto userDto)
  {
   return _userService.UpdateUser(userDto);
  }
  [HttpPost]
  [Route("api/user/UpdateRoles")]
  public OutputBase UpdateRoles([FromBody] UserDto userDto)
  {
   return _userService.UpdateRoles(userDto);
  }
  [HttpPost]
  [Route("api/user/DeleteUser/{id}")]
  public OutputBase DeleteUser(int id)
  {
   return _userService.DeleteUser(id);
  }
  [HttpPost]
  [Route("api/user/DeleteRole/{id}/{roleId}")]
  public OutputBase DeleteRole(int id, int roleId)
  {
   return _userService.DeleteRole(id, roleId);
  }
 }

  從上面代碼實(shí)現(xiàn)可以看出,User REST 服務(wù)依賴與IUserService接口,并且也沒(méi)有像傳統(tǒng)的方式將所有的業(yè)務(wù)邏輯放在Web API實(shí)現(xiàn)中,而是將具體的一些業(yè)務(wù)實(shí)現(xiàn)封裝到對(duì)應(yīng)的應(yīng)用層中,Rest API只負(fù)責(zé)調(diào)用對(duì)應(yīng)的應(yīng)用層中的服務(wù)。這樣設(shè)計(jì)好處有:

REST 服務(wù)部依賴與應(yīng)用層接口,使得職責(zé)分離,將應(yīng)用層服務(wù)的實(shí)例化交給單獨(dú)的依賴注入容器去完成,而REST服務(wù)只負(fù)責(zé)調(diào)用對(duì)應(yīng)應(yīng)用服務(wù)的方法來(lái)獲取數(shù)據(jù)。采用依賴接口而不依賴與具體類的實(shí)現(xiàn),使得類與類之間低耦合。REST服務(wù)內(nèi)不包括具體的業(yè)務(wù)邏輯實(shí)現(xiàn)。這樣的設(shè)計(jì)可以使得服務(wù)更好地分離,如果你后期想用WCF來(lái)實(shí)現(xiàn)REST服務(wù)的,這樣就不需要重復(fù)在WCF的REST服務(wù)類中重復(fù)寫一篇Web API中的邏輯了,這時(shí)候完全可以調(diào)用應(yīng)用服務(wù)的接口方法來(lái)實(shí)現(xiàn)WCF REST服務(wù)。所以將業(yè)務(wù)邏輯實(shí)現(xiàn)抽到應(yīng)用服務(wù)層去實(shí)現(xiàn),這樣的設(shè)計(jì)將使得REST 服務(wù)職責(zé)更加單一,REST服務(wù)實(shí)現(xiàn)更容易擴(kuò)展。

  用戶應(yīng)用服務(wù)的實(shí)現(xiàn):

public class UserService : BaseService, IUserService
 {
  private readonly IUserRepository _userRepository;
  private readonly IUserRoleRepository _userRoleRepository;
  public UserService(IUserRepository userRepository, IUserRoleRepository userRoleRepository)
  {
   _userRepository = userRepository;
   _userRoleRepository = userRoleRepository;
  }
  public GetResults<UserDto> GetUsers(PageInput input)
  {
   var result = GetDefault<GetResults<UserDto>>();
   var filterExp = BuildExpression(input);
   var query = _userRepository.Find(filterExp, user => user.Id, SortOrder.Descending, input.Current, input.Size);
   result.Total = _userRepository.Find(filterExp).Count();
   result.Data = query.Select(user => new UserDto()
   {
    Id = user.Id,
    CreateTime = user.CreationTime,
    Email = user.Email,
    State = user.State,
    Name = user.Name,
    RealName = user.RealName,
    Password = "*******",
    Roles = user.UserRoles.Take(4).Select(z => new BaseEntityDto()
    {
     Id = z.Role.Id,
     Name = z.Role.RoleName
    }).ToList(),
    TotalRole = user.UserRoles.Count()
   }).ToList();
   return result;
  }
  public UpdateResult UpdateUser(UserDto user)
  {
   var result = GetDefault<UpdateResult>();
   var existUser = _userRepository.FindSingle(u => u.Id == user.Id);
   if (existUser == null)
   {
    result.Message = "USER_NOT_EXIST";
    result.StateCode = 0x00303;
    return result;
   }
   if (IsHasSameName(existUser.Name, existUser.Id))
   {
    result.Message = "USER_NAME_HAS_EXIST";
    result.StateCode = 0x00302;
    return result;
   }
   existUser.RealName = user.RealName;
   existUser.Name = user.Name;
   existUser.State = user.State;
   existUser.Email = user.Email;
   _userRepository.Update(existUser);
   _userRepository.Commit();
   result.IsSaved = true;
   return result;
  }
  public CreateResult<int> AddUser(UserDto userDto)
  {
   var result = GetDefault<CreateResult<int>>();
   if (IsHasSameName(userDto.Name, userDto.Id))
   {
    result.Message = "USER_NAME_HAS_EXIST";
    result.StateCode = 0x00302;
    return result;
   }
   var user = new User()
   {
    CreationTime = DateTime.Now,
    Password = "",
    Email = userDto.Email,
    State = userDto.State,
    RealName = userDto.RealName,
    Name = userDto.Name
   };
   _userRepository.Add(user);
   _userRepository.Commit();
   result.Id = user.Id;
   result.IsCreated = true;
   return result;
  }
  public DeleteResult DeleteUser(int userId)
  {
   var result = GetDefault<DeleteResult>();
   var user = _userRepository.FindSingle(x => x.Id == userId);
   if (user != null)
   {
    _userRepository.Delete(user);
    _userRepository.Commit();
   }
   result.IsDeleted = true;
   return result;
  }
  public UpdateResult UpdatePwd(UserDto user)
  {
   var result = GetDefault<UpdateResult>();
   var userEntity =_userRepository.FindSingle(x => x.Id == user.Id);
   if (userEntity == null)
   {
    result.Message = string.Format("當(dāng)前編輯的用戶“{0}”已經(jīng)不存在", user.Name);
    return result;
   }
   userEntity.Password = user.Password;
   _userRepository.Commit();
   result.IsSaved = true;
   return result;
  }
  public GetResult<UserDto> GetUser(int userId)
  {
   var result = GetDefault<GetResult<UserDto>>();
   var model = _userRepository.FindSingle(x => x.Id == userId);
   if (model == null)
   {
    result.Message = "USE_NOT_EXIST";
    result.StateCode = 0x00402;
    return result;
   }
   result.Data = new UserDto()
   {
    CreateTime = model.CreationTime,
    Email = model.Email,
    Id = model.Id,
    RealName = model.RealName,
    State = model.State,
    Name = model.Name,
    Password = "*******"
   };
   return result;
  }
  public UpdateResult UpdateRoles(UserDto user)
  {
   var result = GetDefault<UpdateResult>();
   var model = _userRepository.FindSingle(x => x.Id == user.Id);
   if (model == null)
   {
    result.Message = "USE_NOT_EXIST";
    result.StateCode = 0x00402;
    return result;
   }
   var list = model.UserRoles.ToList();
   if (user.Roles != null)
   {
    foreach (var item in user.Roles)
    {
     if (!list.Exists(x => x.Role.Id == item.Id))
     {
      _userRoleRepository.Add(new UserRole { RoleId = item.Id, UserId = model.Id });
     }
    }
    foreach (var item in list)
    {
     if (!user.Roles.Exists(x => x.Id == item.Id))
     {
      _userRoleRepository.Delete(item);
     }
    }
    _userRoleRepository.Commit();
    _userRepository.Commit();
   }
   result.IsSaved = true;
   return result;
  }
  public DeleteResult DeleteRole(int userId, int roleId)
  {
   var result = GetDefault<DeleteResult>();
   var model = _userRoleRepository.FindSingle(x => x.UserId == userId && x.RoleId == roleId);
   if (model != null)
   {
    _userRoleRepository.Delete(model);
    _userRoleRepository.Commit();
   }
   result.IsDeleted = true;
   return result;
  }
  public bool Exist(string username, string password)
  {
   return _userRepository.FindSingle(u => u.Name == username && u.Password == password) != null;
  }
  private bool IsHasSameName(string name, int userId)
  {
   return !string.IsNullOrWhiteSpace(name) && _userRepository.Find(u=>u.Name ==name && u.Id != userId).Any();
  }
  private Expression<Func<User, bool>> BuildExpression(PageInput pageInput)
  {
   Expression<Func<User, bool>> filterExp = user => true;
   if (string.IsNullOrWhiteSpace(pageInput.Name))
    return filterExp;
   switch (pageInput.Type)
   {
    case 0:
     filterExp = user => user.Name.Contains(pageInput.Name) || user.Email.Contains(pageInput.Name);
     break;
    case 1:
     filterExp = user => user.Name.Contains(pageInput.Name);
     break;
    case 2:
     filterExp = user => user.Email.Contains(pageInput.Name);
     break;
   }
   return filterExp;
  }
 }

  這里應(yīng)用服務(wù)層其實(shí)還可以進(jìn)一步的優(yōu)化,實(shí)現(xiàn)代碼層級(jí)的讀寫分離,定義IReadOnlyService接口和IWriteServie接口,并且把寫操作可以采用泛型方法的方式抽象到BaseService中去實(shí)現(xiàn)。這樣一些增刪改操作實(shí)現(xiàn)公用,之所以可以將這里操作實(shí)現(xiàn)公用,是因?yàn)檫@些操作都是非常類似的,無(wú)非是操作的實(shí)體不一樣罷了。其實(shí)這樣的實(shí)現(xiàn)在我另一個(gè)開(kāi)源項(xiàng)目中已經(jīng)用到:OnlineStore.大家可以參考這個(gè)自行去實(shí)現(xiàn)。

  倉(cāng)儲(chǔ)層的實(shí)現(xiàn):

  用戶應(yīng)用服務(wù)也沒(méi)有直接依賴與具體的倉(cāng)儲(chǔ)類,同樣也是依賴其接口。對(duì)應(yīng)的用戶倉(cāng)儲(chǔ)類的實(shí)現(xiàn)如下:

public class BaseRepository<TEntity> : IRepository<TEntity>
  where TEntity :class , IEntity
 {
  private readonly ThreadLocal<UserManagerDBContext> _localCtx = new ThreadLocal<UserManagerDBContext>(() => new UserManagerDBContext());
  public UserManagerDBContext DbContext { get { return _localCtx.Value; } }
  public TEntity FindSingle(Expression<Func<TEntity, bool>> exp = null)
  {
   return DbContext.Set<TEntity>().AsNoTracking().FirstOrDefault(exp);
  }
  public IQueryable<TEntity> Find(Expression<Func<TEntity, bool>> exp = null)
  {
   return Filter(exp);
  }
  public IQueryable<TEntity> Find(Expression<Func<TEntity, bool>> expression, Expression<Func<TEntity, dynamic>> sortPredicate, SortOrder sortOrder, int pageNumber, int pageSize)
  {
   if (pageNumber <= 0)
    throw new ArgumentOutOfRangeException("pageNumber", pageNumber, "pageNumber must great than or equal to 1.");
   if (pageSize <= 0)
    throw new ArgumentOutOfRangeException("pageSize", pageSize, "pageSize must great than or equal to 1.");
   var query = DbContext.Set<TEntity>().Where(expression);
   var skip = (pageNumber - 1) * pageSize;
   var take = pageSize;
   if (sortPredicate == null)
    throw new InvalidOperationException("Based on the paging query must specify sorting fields and sort order.");
   switch (sortOrder)
   {
    case SortOrder.Ascending:
     var pagedAscending = query.SortBy(sortPredicate).Skip(skip).Take(take);
     return pagedAscending;
    case SortOrder.Descending:
     var pagedDescending = query.SortByDescending(sortPredicate).Skip(skip).Take(take);
     return pagedDescending;
   }
   throw new InvalidOperationException("Based on the paging query must specify sorting fields and sort order.");
  }
  public int GetCount(Expression<Func<TEntity, bool>> exp = null)
  {
   return Filter(exp).Count();
  }
  public void Add(TEntity entity)
  {
   DbContext.Set<TEntity>().Add(entity);
  }
  public void Update(TEntity entity)
  {
   DbContext.Entry(entity).State = EntityState.Modified;
  }
  public void Delete(TEntity entity)
  {
   DbContext.Entry(entity).State = EntityState.Deleted;
   DbContext.Set<TEntity>().Remove(entity);
  }
  public void Delete(ICollection<TEntity> entityCollection)
  {
   if(entityCollection.Count ==0)
    return;
   DbContext.Set<TEntity>().Attach(entityCollection.First());
   DbContext.Set<TEntity>().RemoveRange(entityCollection);
  }
  private IQueryable<TEntity> Filter(Expression<Func<TEntity, bool>> exp)
  {
   var dbSet = DbContext.Set<TEntity>().AsQueryable();
   if (exp != null)
    dbSet = dbSet.Where(exp);
   return dbSet;
  }
  public void Commit()
  {
   DbContext.SaveChanges();
  }
 }
public class UserRepository :BaseRepository<User>, IUserRepository
 {
 }

四、AngularJS前端實(shí)現(xiàn)

  Web前端的實(shí)現(xiàn)就是采用AngularJS來(lái)實(shí)現(xiàn),并且采用模塊化開(kāi)發(fā)模式。具體Web前端的代碼結(jié)構(gòu)如下圖所示:

App/images // 存放Web前端使用的圖片資源
App/Styles // 存放樣式文件
App/scripts // 整個(gè)Web前端用到的腳本文件
    / Controllers // angularJS控制器模塊存放目錄
    / directives // angularJs指令模塊存放目錄
    / filters // 過(guò)濾器模塊存放目錄
    / services // 服務(wù)模塊存放目錄
   / app.js // Web前端程序配置模塊(路由配置)
App/Modules // 項(xiàng)目依賴庫(kù),angular、Bootstrap、Jquery庫(kù)
App/Views // AngularJs視圖模板存放目錄

  使用AngularJS開(kāi)發(fā)的Web應(yīng)用程序的代碼之間的調(diào)用層次和后端基本一致,也是視圖頁(yè)面——》控制器模塊——》服務(wù)模塊——》Web API服務(wù)。

  并且Web前端CSS和JS資源的加載采用了Bundle的方式來(lái)減少請(qǐng)求資源的次數(shù),從而加快頁(yè)面加載時(shí)間。具體Bundle類的配置:

public class BundleConfig
 {
  // For more information on bundling, visit http://go.microsoft.com/fwlink/?LinkId=301862
  public static void RegisterBundles(BundleCollection bundles)
  {
   //類庫(kù)依賴文件
   bundles.Add(new ScriptBundle("~/js/base/lib").Include(
     "~/app/modules/jquery-1.11.2.min.js",
     "~/app/modules/angular/angular.min.js",
     "~/app/modules/angular/angular-route.min.js",
     "~/app/modules/bootstrap/js/ui-bootstrap-tpls-0.13.0.min.js",
     "~/app/modules/bootstrap-notify/bootstrap-notify.min.js"
     ));
   //angularjs 項(xiàng)目文件
   bundles.Add(new ScriptBundle("~/js/angularjs/app").Include(
     "~/app/scripts/services/*.js",
     "~/app/scripts/controllers/*.js",
     "~/app/scripts/directives/*.js",
     "~/app/scripts/filters/*.js",
     "~/app/scripts/app.js"));
   //樣式
   bundles.Add(new StyleBundle("~/js/base/style").Include(
     "~/app/modules/bootstrap/css/bootstrap.min.css",
     "~/app/styles/dashboard.css",
     "~/app/styles/console.css"
     ));
  }
 }

  首頁(yè) Index.cshtml

<!DOCTYPE html>
<html ng-app="LH">
<head>
 <meta name="viewport" content="width=device-width" />
 <title>簡(jiǎn)易權(quán)限管理系統(tǒng)Demo</title>
 @Styles.Render("~/js/base/style")
 @Scripts.Render("~/js/base/lib")
</head>
<body ng-controller="navigation">
 <nav class="navbar navbar-inverse navbar-fixed-top">
  <div class="container-fluid">
   <div class="navbar-header">
    <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
     <span class="sr-only">Toggle navigation</span>
     <span class="icon-bar"></span>
     <span class="icon-bar"></span>
     <span class="icon-bar"></span>
    </button>
    <a class="navbar-brand" href="/">簡(jiǎn)易權(quán)限管理系統(tǒng)Demo</a>
   </div>
   <div class="navbar-collapse collapse">
    <ul class="nav navbar-nav navbar-left">
     <li class="{{item.isActive?'active':''}}" ng-repeat="item in ls">
      <a href="#{{item.urls[0].link}}">{{item.name}}</a>
     </li>
    </ul>
    <div class="navbar-form navbar-right">
     <a href="@Url.Action("UnLogin", "Home", null)" class="btn btn-danger">
      {{lang.exit}}
     </a>
    </div>
   </div>
  </div>
 </nav>
 <div class="container-fluid">
  <div class="row">
   <div class="col-sm-3 col-md-2 sidebar">
    <ul class="nav nav-sidebar">
     <li class="{{item.isActive?'active':''}}" ng-repeat="item in urls"><a href="#{{item.link}}">{{item.title}}</a></li>
    </ul>
   </div>
   <div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main">
    <div ng-view></div>
   </div>
  </div>
 </div>
 @Scripts.Render("~/js/angularjs/app")
</body>
</html>

五、運(yùn)行效果

  介紹完前后端的實(shí)現(xiàn)之后,接下來(lái)讓我們看下整個(gè)項(xiàng)目的運(yùn)行效果:

六、總結(jié)

  到此,本文的所有內(nèi)容都介紹完了,盡管本文的AngularJS的應(yīng)用項(xiàng)目還有很多完善的地方,例如沒(méi)有緩沖的支持、沒(méi)有實(shí)現(xiàn)讀寫分離,沒(méi)有對(duì)一些API進(jìn)行壓力測(cè)試等。但AngularJS在實(shí)際項(xiàng)目中的應(yīng)用基本是這樣的,大家如果在項(xiàng)目中有需要用到AngularJS,正好你們公司的后臺(tái)又是.NET的話,相信本文的分享可以是一個(gè)很好的參考。另外,關(guān)于架構(gòu)的設(shè)計(jì)也可以參考我的另一個(gè)開(kāi)源項(xiàng)目:OnlineStoreFastWorks。

以上所述是小編給大家介紹的使用AngularJs打造權(quán)限管理系統(tǒng)的方法,希望對(duì)大家有所幫助!

相關(guān)文章

  • AngularJS使用ng-class動(dòng)態(tài)增減class樣式的方法示例

    AngularJS使用ng-class動(dòng)態(tài)增減class樣式的方法示例

    這篇文章主要介紹了AngularJS使用ng-class動(dòng)態(tài)增減class樣式的方法,結(jié)合具體實(shí)例形式分析了ng-class操作頁(yè)面class樣式的相關(guān)技巧,需要的朋友可以參考下
    2017-05-05
  • 深入學(xué)習(xí)AngularJS中數(shù)據(jù)的雙向綁定機(jī)制

    深入學(xué)習(xí)AngularJS中數(shù)據(jù)的雙向綁定機(jī)制

    這篇文章主要介紹了AngularJS中數(shù)據(jù)的雙向綁定機(jī)制,雙向綁定使得HTML中呈現(xiàn)的view與AngularJS中的數(shù)據(jù)一致,是Angular的重要特性之一,需要的朋友可以參考下
    2016-03-03
  • 解決三元運(yùn)算符 報(bào)錯(cuò)“SyntaxError: can''''t assign to conditional expression”

    解決三元運(yùn)算符 報(bào)錯(cuò)“SyntaxError: can''''t assign to conditional expre

    在本篇文章里小編給大家整理的是關(guān)于python三元運(yùn)算符 報(bào)錯(cuò)“SyntaxError: can't assign to conditional expression”的處理方法,需要的朋友們學(xué)習(xí)下。
    2020-02-02
  • AngularJS快速入門

    AngularJS快速入門

    本文通過(guò)幾個(gè)循序漸進(jìn)的例子,給大家詳細(xì)講解了如何快速入門AngularJS,十分的實(shí)用,這里推薦給大家,有需要的小伙伴可以參考下。
    2015-04-04
  • Angular實(shí)現(xiàn)form自動(dòng)布局

    Angular實(shí)現(xiàn)form自動(dòng)布局

    這篇文章主要介紹了Angular實(shí)現(xiàn)form自動(dòng)布局的相關(guān)資料,以代碼片段的形式分析了Angular實(shí)現(xiàn)form自動(dòng)布局的實(shí)現(xiàn)方法,感興趣的小伙伴們可以參考一下
    2016-01-01
  • 淺談angularjs中響應(yīng)回車事件

    淺談angularjs中響應(yīng)回車事件

    下面小編就為大家?guī)?lái)一篇淺談angularjs中響應(yīng)回車事件。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
    2017-04-04
  • Angular5整合富文本編輯器TinyMCE的方法(漢化+上傳)

    Angular5整合富文本編輯器TinyMCE的方法(漢化+上傳)

    TinyMCE是一個(gè)輕量級(jí)的富文本編輯器,相對(duì)于CK編輯器更加精簡(jiǎn),但必須滿足絕大部分場(chǎng)景的需要。這篇文章主要介紹了Angular5整合富文本編輯器TinyMCE(漢化+上傳)的相關(guān)知識(shí),需要的朋友可以參考下
    2020-05-05
  • 詳解如何在Angular應(yīng)用中發(fā)起HTTP?302 redirect

    詳解如何在Angular應(yīng)用中發(fā)起HTTP?302 redirect

    這篇文章主要介紹了如何在Angular應(yīng)用中發(fā)起HTTP 302 redirect詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪
    2023-12-12
  • 詳解Angularjs 如何自定義Img的ng-load 事件

    詳解Angularjs 如何自定義Img的ng-load 事件

    本篇文章主要介紹了詳解Angularjs 如何自定義Img的ng-load 事件,小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
    2017-02-02
  • angularJs復(fù)選框checkbox選中進(jìn)行ng-show顯示隱藏的方法

    angularJs復(fù)選框checkbox選中進(jìn)行ng-show顯示隱藏的方法

    今天小編就為大家分享一篇angularJs復(fù)選框checkbox選中進(jìn)行ng-show顯示隱藏的方法,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧
    2018-10-10

最新評(píng)論