当前位置: 首页 > 面试题库 >

为什么在控制器中未定义ng-model变量?

华俊贤
2023-03-14
问题内容

我在我的angular js项目中遇到了$ scope的麻烦。例如,当我在输入字段上使用ng-model =“ modelExample”时,我无法使用$
scope.modelExample在我的js中访问它。还有其他人有类似的问题吗?

这很奇怪,调用了一个函数,但是ng-model没有绑定。请参阅下面的代码,当我提交表单时,将调用refreshResults()函数,但$
scope.search返回的是未定义的。

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在评论中解决了我的问题。我使用范围错误。我需要使用对象而不是字符串。换句话说,我需要做的是这样ng- model="search.term"ng- model="search"和这样的JS使用它:$scope.search.term。它与继承有关,但长话短说,如果您的ng-
model中没有点(。),则您做错了。

这是更多信息:http : //jimhoskins.com/2012/12/14/nested-scopes-in-
angularjs.html

谢谢大卫!

汤姆



 类似资料:
  • 问题内容: 我正在使用离子型,并且具有以下视图: 而我的控制器: 我不明白的是,当我单击按钮时,登录功能被正确调用。另外,如果我在控制器中设置为“香蕉煎饼”之类的内容,则视图实际上会更新。 但是,当登录功能实际运行时,会提示未定义MembershipNo和密码。我是Angular和Ionic的新手,所以我知道这可能是一些n00b错误… 问题答案: 修改后的报价: “如果使用ng-model,则必须

  • 问题内容: 我一直在跟随一个教程,教科书向我保证这可以工作,但是 错误:[ng:areq]参数’SimpleController’不是一个函数,未定义 为什么?我掉毛了,在它上面上下移动,看不到问题。为什么出现未定义状态? 问题答案: 我的猜测是您使用的angular.js版本是更新的。 有一个重大变化,即: 默认情况下 , angular将不再寻找控制器。有关更多详细信息,请参见3f2232b5

  • 问题内容: 如果我的措词不正确,我事先表示歉意。我在的内部有一个文本框,当我尝试获取文本框值时始终为。我只希望它显示我在相应文本框中键入的内容。 似乎是一个问题,那么我该如何创建全局或控制器根级别以便可以访问它? 这是帮助解决问题的JSFiddle:http : //jsfiddle.net/stevenng/9mx9B/14/ 问题答案: 在您的点击表达式中,您可以引用并在您的函数中对其进行访问

  • 问题内容: 我在视图中设置了一个变量,然后尝试使用该变量在控制器中进行访问。但是,当我尝试访问它时,出现了。 相关代码段: 我的看法: 我的控制器: JSFiddle 我在这里想念什么? 问题答案: 等待直到变量被初始化。

  • 问题内容: 我写了下面的代码 我知道它在ng- controller之外,因此我无法绑定数据,但是我的应用程序需要calanderCtrl控制器。我想将此值置于范围内,以便我也可以在其他控制器中使用它。我该怎么做呢? 问题答案: 您可以为此使用发布订阅模式。这样,您避免将变量放在rootscope上。 模板加载时,控制器将被调用。 现在如何运作: Angular不共享范围。每个控制器都有自己的单独

  • 问题内容: 它们都没有解释为什么当我声明如下变量时,JavaScript控制台会打印 未定义的 原因: 问题答案: 它打印此表达式的结果-是 。是的, 它本身就是一个有效的表达式。 实际上,您宁可为书写时为什么打印或类似的东西而感到开心。如果语句已处理,它也会打印。实际上,如果还有另一条带有某些“真实”结果的语句,则似乎忽略了所有and 声明(!)语句: 现在,我想背后的真正原因是行为的语句,描述