小编典典

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

angularjs

我在我的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>

阅读 220

收藏
2020-07-04

共1个答案

小编典典

@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

谢谢大卫!

汤姆

2020-07-04