尝试让AngularJS在JSFiddle中工作

Attempt to get AngularJS to work in JSFiddle

本文关键字：JSFiddle 工作 AngularJS      更新时间：2023-09-26

我正在学习一个在线教程，并试图让angularjs使用jsfidd。我对jsfiddle不是很熟悉，而且由于（我认为）jsfiddler设置，我很难让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）
  • 无换行符<身体>

小提琴选项设置为：

  • body标记：<body ng app="rew">

但似乎只有第一个H1在起作用。输出是这样的：

徒步旅行｛徒步旅行.trail.name｝｝{徒步旅行.小径.英里}}｛｛"继续前进"｝｝｛｛"完成"｝｝

有人看到我做错了什么吗？我希望javascript的结构与所示代码保持相似，这样我就可以按照教程进行操作了——我的假设是jsfiddle设置有问题。

谢谢你的帮助！

您使用的是旧版本的angular。已更新版本。其他一切都很好。

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

No Code changes.
相关文章：