如何从有角度的背景中思考余烬

Sup*_*per 1 ember.js angularjs

我有一个新项目,我必须使用ember.我怎样才能过渡到余烬,因为我对角度有很强的理解和经验.

Ben*_*esh 10

我在这两个框架方面都有丰富的经验.我在博客上广泛地谈论了他们的分歧.我也是这两个框架的贡献者(更多的是Angular而不是Ember).

要记住以下几点:

1.控制器在Ember的角度!==控制器中.

他们是两个不同的东西,有点像.Ember中的控制器用于向您从Route返回的模型添加行为.Angular中的控制器更像是一种设置模型和与视图相关的其他业务逻辑的方法.

2.从路线开始

Angular并不像Ember那样"以路线为中心".在Angular中,路线甚至不是必需的.

在Ember,你总是从一条路线......和一条"路线"开始.一些消歧:在Ember有路由器,还有路线.路由器是您设置路线的地方(在Angular中使用'ui.router'或'routerProvider').该路线是具有一个类model上它的功能.这样做的目的是在转换之前加载您的视图所需的数据. 在Angular中,Route类就像一个不那么笨重,更强大的"解析"版本.

把手很难看......处理它(现在)

所以你会开始看到{{#each}}{{bind-attr poop="yuck"}}到处都是.欢迎来到车把.它就像Angular模板的丑陋版本,但您需要使用{{bind-attr}}绑定元素上的属性.

不要惊慌!有一个更好的解决方案称为HTMLBars(据称)正在路上.

4.操作而不是$ scope或controller上的方法

在Ember中,为了绑定点击事件,在我看来并不是那么直截了当,但基本上:

JS

app.controller('MyCtrl', function($scope) {
  $scope.foo = function(){ 
    console.log('wee');
  };
});
Run Code Online (Sandbox Code Playgroud)

HTML

<button ng-click="foo()">foo</button>
Run Code Online (Sandbox Code Playgroud)

JS

App.MyController = Ember.Controller.extend({
  actions: {
    foo: function() {
      console.log('wee');
    },
  },
});
Run Code Online (Sandbox Code Playgroud)

HBS

<button {{action 'foo'}}>foo</button>
Run Code Online (Sandbox Code Playgroud)

对于恩伯来说,学习曲线是陡峭的

它难以学习的原因之一是它为你做了很多.它具有非常非常宽的表面积.但是你会挣扎.比你对Angular所做的更多,我保证.Ember更新,它不是(非常)受欢迎,所以资源有点薄.但它有很大的牵引力,总的来说它是一个非常棒的框架.

我发现API文档GitHub repo充满了有用的花絮.

6.使用Ember-CLI

我不能强调这一点.如果您刚刚开始新的Ember项目,请使用Ember-CLI.你不会后悔的.它使用ES6模块处理设置构建,单元测试和编译.它将极大地简化您的开发过程.

除此之外,祝你好运.不要灰心.学习新事物总是很难.但是你正在拓宽你的技能,这是一件好事.