2013-05-29 1 views
4

В AngularJS можно вызвать методы из шаблонов без директивы или routeProvider для привязки области?ng-click не запускается из шаблона

Моя особая проблема в том, что мой основной контроллер (AppCtrl) расположен на теле моей индексной страницы. В индексе я использую ngView для вытягивания шаблонов в соответствии с маршрутизацией. Каждый routeProvider имеет свой собственный контроллер, за исключением шаблона по умолчанию. Я предположил, что из-за наследования области я мог бы использовать методы, определенные с помощью AppCtrl из шаблона, но пытаюсь просто сделать простое оповещение или console.log ничего не регистрирует. Я знаю, что $ scope подходит к шаблону, потому что мои данные отображаются правильно.

Это, кажется, проблема с $ scope, но я не уверен, как ее решить. Нужно ли мне создавать директиву, чтобы их явно связывать?

index.html

<body ng-controller="AppCtrl"> 
    <div ng-view></div> 
</body> 

app.js

var myApp = angular.module('myApp', []) 
.config(function($routeProvider) { 
    .when('/', { 
    templateUrl: 'partials/list.html' 
    }), 
    .when('/info/:id, { 
    templateUrl: 'partials/info.html' 
    controller: 'InfoCtrl' 
    }); 
}); 

controllers.js

var controllers = {}; 
controllers.AppCtrl = function($scope, $location, Factory) { 
    ... 
    $scope.doSomething = function() { 
    alert('hello'); 
    }; 
}; 
myApp.controller(controllers); 

list.html

<a href="#" ng-click="doSomething()">Do Something</a> // no response 
+1

попытайтесь добавить его на объект $ rootScope – Ven

+2

Он должен работать. Вот [рабочая скрипка] (http://jsfiddle.net/mrajcok/zcybQ/). –

+0

Каждый раз. Посылая это на час или два, и сегодня это работает. Клянусь, каждый раз, когда я пешу и прошу помочь, все начинает работать самостоятельно. Хорошо, спасибо за ответы. – iamsar

ответ

3

Кажется, я нашел корень своей проблемы. Как описано, использование функции действительно сработало. Когда я вернулся к решению моей конкретной проблемы, функция снова отказалась работать. Оказывается, это не проблема масштаба, а проблема привязки. Пример, который я дал, не был точен, но помог мне изолировать проблему. Я продемонстрирую:

<!-- alert fires, tries to find '#' in location, binded values do not update --> 
<a href="#" ng-click="addOne()">Add 1</a> 

<!-- key binding does not update --> 
<a href="#" ng-click="key = key+1" ng-init="key=0">Add 1</a> 

<!-- key updates --> 
<a ng-click="key = key+1" ng-init="key=0">Add 1</a> 

По какой-либо причине, включая href, предотвращалось обновление привязанного значения. Кто-нибудь знает, есть ли «preventDefault», который можно использовать в качестве обходного пути, чтобы hrefs можно было включить для проверки? Кажется, что это либо ошибка, либо ng-click предназначен только для использования с кнопками.

+1

1. Ищите примеры в документации ngHref, для стиля preventDefault нажмите (вниз по странице - 5 кликов примеры демо) - http://docs.angularjs.org/api/ng/directive/ngHref – neoswf

+1

2. Вторая вещь - вы всегда можете написать директиву и добавить ее в свой элемент как атрибут, чтобы сделать preventDefault – neoswf

+1

@neoswf спасибо за добавление ссылки. Я не думаю, что это было в их документах в то время. – iamsar

Смежные вопросы