尝试让 AngularJS 在 JSFiddle 中工作

Attempt to get AngularJS to work in JSFiddle

我正在按照在线教程进行操作，并试图让 angularjs 在 jsfiddle[=42 上工作=].我对 jsfiddle 不是很熟悉，并且由于（我认为）jsfiddle 设置，我很难让 javascript 和 html 一起工作。

这是我的代码：http://jsfiddle.net/russellelbert/yh4c1hoe/

HTML:

<h1>{{"hiking..."}}</h1>
    <div ng-controller="HikeController as hike">
    <h1> {{hike.trail.name}}  </h1>
    <h1> {{hike.trail.miles}} </h1>
    <h1> {{"keep going"}}     </h1>
</div>    
<h1>{{"done"}}</h1>

JavaScript:

(function(){
    var app = angular.module('rew', []);
    app.controller('HikeController', function(){
        this.trail = hike;
    });
    var hike = {
        name: 'Colchuck Lake',
        miles: 4.5,
    }
})();

我将框架和扩展设置为：

  • 无库（纯 JS）
  • 不换行 - 在
    • 中

并且 fiddle 选项设置为：

  • 正文标签：

但似乎只有第一个 H1 有效。输出是这样的：

    远足...
    {{hike.trail.name}}
    {{hike.trail.miles}}
    {{"keep going"}}
    {{"done"}}

谁能看出我做错了什么？我想保持 javascript 的结构与显示的代码相似，这样我就可以按照教程进行操作 - 我的假设是 jsfiddle 设置有问题。

感谢您的帮助！

您使用的是旧版本 angular。更新了版本。其他都还好。

http://jsfiddle.net/yh4c1hoe/1/

No Code changes.