AngularJS, dynamically loaded view can't see corresponding controller

Question

I trying to write app using angularjs and bootsrap. I use RoR on server, SLIM and CoffeeScript for templates and assets. This is my index file:

doctype
html lang="en" ng-app='my_server'
  head
    meta charset="utf-8"
      meta content="IE=Edge,chrome=1" http-equiv="X-UA-Compatible"

      title= content_for?(:title) ? yield(:title) : "MyServer"
      = csrf_meta_tags
      = stylesheet_link_tag "application", :media => "all"
      = favicon_link_tag
      = javascript_include_tag "application"
  body
    .navbar.navbar-fluid-top
      .navbar-inner
        .container-fluid
          a.btn.btn-navbar data-target=".nav-collapse" data-toggle="collapse"
            span.icon-bar
            span.icon-bar
            span.icon-bar
          a.brand href="#" My server
          .container-fluid.nav-collapse
            ul.nav
              li= link_to "Link1", "/path1"
              li= link_to "Link2", "/path2"
              li= link_to "Link3", "/path3"
          /! /.nav-collapse
    .container-fluid
      .container-fluid(ng-view)
      footer
        p &copy; Company 2013
    /! /container

app.js.coffee:

@app = angular.module('my_server', [])
  .config(['$routeProvider', ($routeProvider) -> @RouteProvider($routeProvider)])
  .run(['$rootScope', '$location', ($rootScope, $location) ->
  ])

routes.js.coffee:

@RouteProvider = ($routeProvider) ->
  $routeProvider.when('/sign_in', {templateUrl: 'assets/sign_in.html', controller: SignInController})

sign_in_controller.js.coffee:

@SignInController = ($scope, $routeParams) ->
    alert("Controller loaded")
    Auth = ->
        alert("Auth")

And sign_in.html.slim, that loads dynamically(i have modified rails asset pipeline configuration, so i can use SLIM for static pages):

.body
  form
    fieldset
      legeng Sign in
      label
        input type='email' placeholder='email' ng-model='email'
      label
        input type='password' placeholder='password' ng-model='password'
      button.btn ng-click='Auth()' Auth

When i trying to go on /#/sign_in i see my auth form, i see alert with "Controller loaded" message, so i think that SignInController is loaded. But when i press Auth button on my form i don't see alert with "Auth" message, i.e. controller method Auth don't called. When i trying to write something like this in SignInController

$scope.email = 'email@example.com

i don't see this email in my form. I have no errors or warnings in browser console.

Why my partial form don't see my controller? What am I doing wrong?

update:

Controller methods must be defined as $scope properties

score 0 · Answer 1 · answered Aug 17 '13 at 19:53

0

The Auth method needs to be a scope property. Try changing

Auth = ->
    alert("Auth")

to

$scope.Auth = ->
    alert("Auth")

answered Aug 17 '13 at 19:53

rajasaur

5,340
2
27
22

AngularJS, dynamically loaded view can't see corresponding controller

1 Answers1