Comments (21)
关于DI的问题,我文中这样描述的
- 随着系统代码量的增长,出现服务重名的几率会越来越大。
- 查找一个服务的定义代码比较困难,尤其是一个多人开发的集成系统(当然你也可以把原因归咎于 编辑器/IDE 不够强大)。
假设这样一段代码
DI(使用自制的Inject decorator):
@Inject('ServiceA', 'ServiceB')
class Controller{
getName(){
return this._ServiceA + this._ServiceB;
}
}
module import
import ServiceA from './ServiceA';
import ServiceB from './ServiceB';
class Controller{
getName(){
return this._ServiceA + this._ServiceB;
}
}
哪种维护起来成本更高显而易见吧,DI的方式你几乎不可能知道ServiceA跟ServiceB在哪里定义的。
你说到的迁移,我一开始确实也是从这一点出发的,给他设计了一个可能迁移上层框架的‘伪需求’。但是后来**有所转变,就是不论框架是否可能迁移,M/VM层做成框架无关都是架构上确实存在的需求。
古者有云,衡量一个完美的MV*架构的标准就是,在V随意变化的情况下,你的M*是可以不改一行代码的情况下就完成迁移的。
各层解耦独立是核心诉求,便于架构迁移只是这件事带来的‘副作用’。
成本的话主要还是在要理解MVVM架构的思路以及需要造一些用于抹平ng特性的基础上层组件(如Inject decorator),但这些都是一次性的。相反的它带来的收益却都是持续的。
另外,这年头还不用ES6写代码,就真的太土了啊!😂
from kuitos.github.io.
@xiaoyu2er 团队切换代价这个事情没有那么大,总的来说,就是把es5的controller, service之类换成了es6的class形势,其他地方都是一些配置性的变更
from kuitos.github.io.
import includingTpl from './include.html';
class Controller {
includingTpl = includingTpl
}
<ng-include src="$ctrl.includingTpl"></ng-include>
@seven4x 是这个意思么?
from kuitos.github.io.
非常棒的思路呢,我们在使用中只是使用了部分ES6的功能来简化代码,连import之类的都没用上。
另外,我们当前也处在比较纠结的一个阶段,暂定目标是先搞一个基于ng2的东西出来,之前做的东西再慢慢迁移。
请问,你们针对angular2怎么看,有打算升级么?
from kuitos.github.io.
@hstarorg 我们暂时是没打算升级的,主要考虑的还是一个成本问题,毕竟ng2的新的语法跟typescript不是每个人都能快速掌握的。
原本的初衷确实是为了后面可能的框架迁移方便,但是现在我觉得,把业务模型从框架中抽离出来是任何一种模式下都应该首先考虑的,我们需要确保架构的层次清晰,只是它顺便让上层迁移变的容易了而已。
ng2带来的一些东西还是很值得研究的,比如rx跟zone,不过对于我们公司这样一个团队(angular上普遍比较熟)直接切ng2成本还是有点高,相反我可能更倾向于vue2。
from kuitos.github.io.
@kuitos 我们也需要升级成本(学习成本,修改成本)的问题,但是又没啥好的办法。现在连使用ng1都还是老旧的语法,这个团队多了也很难处理。
我仅仅了解vue1,比较有特色的双向绑定,暂时对vue2不了解。看样子得抽时间看看了。
抛开基础框架不说,ng2比ng1简单,但是搭框架反而更复杂了。
from kuitos.github.io.
很赞!
个人也是觉得民工叔在定义 directive 的时候采用 class 的方式不如博主所用的对象字面量的方式来的直观
请教一个问题 @kuitos , 虽然我也同意博主所说的尽可能把 model 做的框架无关, 利于迁移.
但是如果很长一段时间框架基本不会迁移, 是不是还是直接采用 DI 的形式好一些.
毕竟博主所呈现出来的代码书写风格已经很不像 angular 了. 不知道这个转变对于团队来说成本有多大?
from kuitos.github.io.
好的! 让我先消化消化..... 过段时间我再来向您请教!
from kuitos.github.io.
兄弟劝你一句,别升级瞎整了.angular2 和 an1是断层发展的, angular1 谷歌是不是维护都难说. 你还整合 es6 . 给自己找事. 想用 es6 试着切到 react 或者 vue. react 最佳.
from kuitos.github.io.
@hcforbaidu 不是每个项目都可以从零开始的 国内外用 ng1 的公司还是很多的
用 ES6 webpack 等只不过是希望提高开发和维护效率
from kuitos.github.io.
@xufei !! 恩 自己还在摸索一套规范 好让同事可以比较不那么纠结的过渡过来, 大体上是 参考了博主和民工叔的风格. 谢谢!
from kuitos.github.io.
@xiaoyu2er 我的个人看法. 因为之前确实搭建了一套基于 angular1的二次开发方案,用于快速开发. an1确实有他方便的地方. 但是后来遇到太多太多坑. an1的**和做法目前来看值得商榷的地方太多太多. 谷歌也明白这个问题,所以an2和1断层发展. 所以对 ng1的项目而言. 我们的思路是维护可用就好.对 an1的项目空费心思划不来.仅是个人看法.
from kuitos.github.io.
@xiaoyu2er 前阵子看到了一个post:https://github.com/toddmotto/angular-styleguide 基本想法是一样的,不过这个作者写的要细节多了😂 虽然有些地方我不是很同意(DI/Service/Filter等几块),不过还是推荐你看看
from kuitos.github.io.
@kuitos 好的! 稍微看了一下 看完交流!
from kuitos.github.io.
@kuitos 先问个问题, template 你是放在 bundle 里还是?
from kuitos.github.io.
@xiaoyu2er 组件模板 import 过来变成字符串模板一起打包,业务模板(通常是路由,可以理解成container) import 过来是文件路径,跟 templateUrl 关联。基于 webpack loader
from kuitos.github.io.
在使用压缩配置如下:
mangle: {
except: ['$super', '$', 'exports', 'require', 'angular'],
keep_fnames: true//it works
}
仍旧出现一段错误:
angular.js:13920 Error: [$injector:unpr] Unknown provider: eProvider <- e
http://errors.angularjs.org/1.5.8/$injector/unpr?p0=eProvider%20%3C-%20e
at http://localhost:9797/assets/scripts/angular/angular.js:68:12
at http://localhost:9797/assets/scripts/angular/angular.js:4511:19
at Object.getService [as get] (http://localhost:9797/assets/scripts/angular/angular.js:4664:39)
at http://localhost:9797/assets/scripts/angular/angular.js:4516:45
at getService (http://localhost:9797/assets/scripts/angular/angular.js:4664:39)
at injectionArgs (http://localhost:9797/assets/scripts/angular/angular.js:4688:58)
at Object.instantiate (http://localhost:9797/assets/scripts/angular/angular.js:4730:18)
at $controller (http://localhost:9797/assets/scripts/angular/angular.js:10369:28)
at Object. (http://localhost:9797/assets/scripts/ui-router/angular-ui-router.js:4250:30)
at http://localhost:9797/assets/scripts/angular/angular.js:1247:18
from kuitos.github.io.
大神,ng-include 用ES6 该如何实现呢?
from kuitos.github.io.
@kuitos 可以,可以 这操作 666 不愧是大神
这样会把 $ctrl.includingTpl
当做URL的一部分发个请求 src的值不能是HTML代码 得换个思路了
from kuitos.github.io.
还有一个疑惑请教大神,在使用ui-router的时候,如何不通过$scope访问父节点的数据呢?
现在访问父节点数据是这样写的
$scope.$parent.data
from kuitos.github.io.
不赞同部分**,选择了框架就要用好框架,而不是在框架的基础上再大量的去框架,如DI部分。
赞同部分**,如组件中 index.js 作为框架语法包装器;业务逻辑采用原生ES;数据层、业务模型能脱离 View 独立测试。
from kuitos.github.io.
Related Issues (20)
- 前端工程化知识要点回顾&思考 HOT 25
- 组件设计之BEM法则 HOT 6
- 基于ui-router的非侵入式angular按需加载方案 HOT 37
- 2015前端生态发展回顾 HOT 67
- Web语义化标准解读 HOT 16
- [译注] MVVM 模式 HOT 3
- TIT HOT 1
- Apollo GraphQL 在 webapp 中应用的思考 HOT 12
- 老树发新芽—使用 mobx 加速你的 AngularJS 应用 HOT 1
- 基于 MobX 构建视图框架无关的数据层-与 Vue 的结合(1) HOT 6
- 为 MobX 开启 Time-Travelling 引擎 HOT 2
- Webpack 中的 sideEffects 到底该怎么用? HOT 2
- [上海/杭州]蚂蚁金服体验技术部前端招聘(内推通道) HOT 3
- 可能是你见过最完善的微前端解决方案 HOT 9
- 微前端的核心价值 HOT 5
- 目标是最完善的微前端解决方案 - qiankun 2.0 HOT 4
- 探索微前端的场景极限 HOT 2
- ES 拾遗之赋值操作与原型链查找 HOT 9
- 关于 import-html-entry 库 中的疑问 HOT 3
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from kuitos.github.io.