为什么我的NG-模型变量在控制器未定义？ [英] Why is my ng-model variable undefined in controller?

问题描述

我有我的角度JS项目，$范围的麻烦。当我使用NG-模式=modelExample在输入栏上例如，我不能用$ scope.modelExample我的js访问它。任何人都有类似的问题？

这是奇怪的，一个函数被调用，但NG-模型不绑定。看到我的code以下，功能refreshResults（）是当我提交表单调用，但$ scope.search返回未定义。

  angular.module（'启动'，
    ['离子'，
    starter.controllers'，
    starter.filters'，
    akoenig.deckgrid'，
    angucomplete
    //'ui.bootstrap'，
    'starter.services']）的.config（函数（$ stateProvider，$ urlRouterProvider）{
    $ stateProvider
        .STATE（'应用'，{
            网址：/应用程序
            摘要：真实，
            templateUrl：模板/ menu.html
            控制器：'AppCtrl
        }）        .STATE（'app.browse'，{
            网址：/浏览，
            观点：{
                menuContent：{
                    templateUrl：模板/ browse.html
                    控制器：'BrowseCtrl
                }
            }
        }）        .STATE（'app.search'，{
            网址：/搜索，
            观点：{
                menuContent：{
                    templateUrl：模板/ search.html
                    控制器：'SearchCtrl
                }
            }
        }）
  //如果没有上述状态相匹配，以此作为后备
  $ urlRouterProvider.otherwise（'/应用/浏览'）;
}）;
angular.module（'starter.controllers'，[]）
.controller（'SearchCtrl'，函数（$范围）{
    $ scope.refreshResults =功能（）{
        的console.log（$ scope.search）;
    };
}）
＆LT;离子视图＆gt;
    ＆LT;离子内容类=有头＆GT;
        ＆LT;形式NG提交=refreshResults（）级=吧吧头项目 - 输入插入＆GT;
            ＆LT;标签类=项，输入包装＆GT;
                ＆LT; I类=图标离子ios7搜索占位符图标＆GT;＆LT; I＆GT /;
                ＆LT;输入类型=搜索占位符=搜索...NG-模式=搜索＆GT;
            ＆LT; /标签＆gt;
        ＆LT; /表及GT;
    ＆LT; /离子含量＆GT;
＆LT; /离子视图＆gt;
 

解决方案

@DavidTryon解决了我的问题的意见。我使用的范围是错误的。我需要使用一个对象而不是字符串。换句话说，我需要做的是这样 NG-模式=search.term不是 NG-模式=搜索并在JS像这样使用它： $ scope.search.term 。它做继承，但长话短说，如果你的NG-模型没有一个点在里面（。），你这样做是错误的。

下面是详细信息：
<一href=\"http://jimhoskins.com/2012/12/14/nested-scopes-in-angularjs.html\">http://jimhoskins.com/2012/12/14/nested-scopes-in-angularjs.html

感谢大卫！

汤姆

I'm having trouble with $scope in my angular js project. When I use ng-model="modelExample" on an input field for example, I can't access it in my js using $scope.modelExample. Has anyone else had a similar problem?

It's bizarre, a function is called but ng-model doesn't bind. See my code below, the function refreshResults() is called when I submit the form but $scope.search returns as undefined.

angular.module('starter', 
    ['ionic', 
    'starter.controllers', 
    'starter.filters', 
    'akoenig.deckgrid', 
    "angucomplete",
    // 'ui.bootstrap', 
    'starter.services'])

.config(function($stateProvider, $urlRouterProvider) {
    $stateProvider
        .state('app', {
            url: "/app",
            abstract: true,
            templateUrl: "templates/menu.html",
            controller: 'AppCtrl'
        })

        .state('app.browse', {
            url: "/browse",
            views: {
                'menuContent' :{
                    templateUrl: "templates/browse.html",
                    controller: 'BrowseCtrl'
                }
            }
        })

        .state('app.search', {
            url: "/search",
            views: {
                'menuContent' :{
                    templateUrl: "templates/search.html",
                    controller: 'SearchCtrl'
                }
            }
        })
  // if none of the above states are matched, use this as the fallback
  $urlRouterProvider.otherwise('/app/browse');
});


angular.module('starter.controllers', [])
.controller('SearchCtrl', function($scope) {
    $scope.refreshResults = function() {
        console.log($scope.search);
    };
})


<ion-view>
    <ion-content class="has-header">
        <form ng-submit="refreshResults()" class="bar bar-header item-input-inset">
            <label class="item-input-wrapper">
                <i class="icon ion-ios7-search placeholder-icon"></i>
                <input type="search" placeholder="Search..." ng-model="search">
            </label>
        </form>
    </ion-content>
</ion-view> 

解决方案

@DavidTryon solved my issue in the comments. I was using scope wrong. I needed to use an object not a string. In other words I need to do something like ng-model="search.term" not ng-model="search" and use it in the js like this: $scope.search.term. It has to do with inheritance but long story short, if your ng-model doesn't have a dot (.) in it, you're doing it wrong.

Here's more info: http://jimhoskins.com/2012/12/14/nested-scopes-in-angularjs.html

Thanks David!

Tom

这篇关于为什么我的NG-模型变量在控制器未定义？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！