Угловое приложение обыкновение нагрузки (JSFiddle)

Question

У меня есть простое приложение угловое здесь

<div ng-app="WhereToMeet" ng-controller="MapCtrl"> 
    <leaflet shape="shape"></leaflet> 
    <button ng-click="clicked()">Clicked</button> 
</div> 


app = angular.module("WhereToMeet", []) 

app.directive "leaflet", -> 
    restrict: "E" 
    replace: true 
    transclude: true 
    template: "<div id=\"map\"></div>" 
    scope: 
    shape: "=shape" 
    link: (scope, element, attrs, ctrl) -> 
    scope.$watch attrs.shape,((newValue, oldValue) -> 
     watched newValue 
    ), true 

    watched = (newValue) -> 
    alert newValue 


@MapCtrl = ($scope) -> 
    clicked = (clicked) -> 
    $scope.shape = "Clicked" 
    alert "clicked" 

Я его в JSFiddle http://jsfiddle.net/charliedavi/bezFB/22/, но он не будет работать. Действительно странно. Я думаю, что его ошибка с моим кофе сценарий, но я не могу видеть его

ошибка:

Uncaught SyntaxError: Unexpected string fiddle.jshell.net:22 
Uncaught Error: No module: WhereToMeet 

в чистом JS

var app; 

app = angular.module("WhereToMeet", []); 

app.directive("leaflet", function() { 



     var watched; 
     ({ 
     restrict: "E", 
     replace: true, 
     transclude: true, 
     template: "<div id=\"map\"></div>", 
     scope: { 
      shape: "=shape" 
     }, 
     link: function(scope, element, attrs, ctrl) { 
      return scope.$watch(attrs.shape, (function(newValue, oldValue) { 
      return watched(newValue); 
      }), true); 
     } 
     }); 
     return watched = function(newValue) { 
     return alert(newValue); 
     }; 
    }); 

    this.MapCtrl = function($scope) { 
     var clicked; 
     return clicked = function(clicked) { 
     $scope.shape = "Clicked"; 
     return alert("clicked"); 
     }; 
    }; 

http://jsfiddle.net/charliedavi/gsPx3/2/

Answer 1

У меня была аналогичная проблема с jsfiddle и угловатые вчера. Я должен был сделать пару вещей, чтобы заставить его работать:

• Jsfiddle добавляет теги для html и body, поэтому просто напишите разметку, которая должна находиться внутри тега тела.
• Добавить оберточную DIV с нг-приложение = «MYAPP» вместо того, чтобы указать другой HTML-тег
• Выберите No-обёртывание, группеВыберите рамках

Я не знаю, что ваш " листок ", но я обновил вашу скрипку, чтобы щелчок вызывал предупреждение

Мне пришлось изменить способ создания экземпляра контроллера, чтобы заставить onclick работать.

http://jsfiddle.net/t9nsY/2/

app.controller("MapCtrl", function ($scope) { 
    $scope.clicked = function (clicked) { 
     console.log("clicked"); 
     $scope.shape = "Clicked"; 
     return alert("clicked"); 
    }; 
}); 

Answer 2

я не знаю сценарий кофе, но угловой. Я просто попытался его решить. ;-)

• Выбери не-обертывание тела, группеВыберите рамки
• Выберите не-библиотеки (чисто-JS)
• Добавить угловые JS как ресурсы

• вручную инициализировать угловым с помощью этого угловых самозагрузок

  angular.bootstrap document, ['WhereToMeet']

• сгенерированный код Javascript находится в другой области. Вы должны решить эту проблему либо добавив параметр -b в CoffeeScript компилятором или экспортировать функцию явно через

  root = exports ? this 
  root.clicked = -> 
       alert "clicked" 
       $scope.shape = "Clicked" 
  

  В настоящее время она работает Fiddle Here