无法让AngularJS在JSFiddle上运行

Cod*_*ein 0 javascript jsfiddle angularjs

我正在尝试使用JSFiddle上的AngularJS.

我已经将其他类似的项目复制到了T,但是当我自己尝试时,JSFiddle给了我各种各样的错误.目前,它告诉我,是不识别我的控制器.

我真的很感激,如果有人能看看我真正简单的小提琴并告诉我为什么它不起作用.

https://jsfiddle.net/ke10sq2v/

这是代码:

angular.module('App', ['ngAnimate'])
.controller("Ctlr", ['$scope', function($Scope){
    $scope.hi = "yolo";
}]);
Run Code Online (Sandbox Code Playgroud)

HTML

<div ng-controller="Ctrl" ng-init="showBoxes=false">
  <div class="block" ng-show="showBoxes">Block 1</div>
  <div class="block" ng-show="showBoxes">Block 2</div>
  <button ng-click="showBoxes=!showBoxes">Toggle</button>
  <p>Show Boxes: {{showBoxes}} {{hi}}</p>
</div>
Run Code Online (Sandbox Code Playgroud)

CSS

.block {
  height: 100px;
  width: 100px;
  background-color: blue;
  margin: 15px 10px;
}
Run Code Online (Sandbox Code Playgroud)

tym*_*eJV 5

一些东西:

您忘记ngApp在HTML中声明该指令

Ctrl在控制器定义中拼错了

$Scope在控制器注入中大写- 但试图参考$scope

工作小提琴:https://jsfiddle.net/ke10sq2v/1/

重要提示:(根据下面Jack A.的评论)您需要为JavaScript选择一种"无包装"加载类型.默认的"on load"不适用于Angular ...

  • 另外,您需要为JavaScript选择一种“ No wrap”加载类型。默认的“加载时”不适用于Angular。 (2认同)