繁体   English   中英

何时在AngularJS中创建范围变量?

[英]When is a scope variable created in AngularJS?

我是Angular的新手。 请考虑以下代码。

        <form name="newEventForm">
            <fieldset>
                <label for="eventName">Event Name:</label>
                <input id="eventName" required ng-model="event.name" type="text" placeholder="Name of your event...">


            <button ng-click="saveEvent(event, newEventForm)" type="submit" class="btn btn-primary">Save</button>
            <button ng-click="cancelEdit()" type="button" class="btn btn-default">Cancel</button>
        </form>

我的问题是-为什么我们需要将事件参数传递给saveEvent函数? 使用ng-model不会通过Angular的双向绑定自动生成event.name变量吗? 例如

<form name="newEventForm">
                <fieldset>
                    <label for="eventName">Event Name:</label>
                    <input id="eventName" required ng-model="event.name" type="text" placeholder="Name of your event...">


                <button ng-click="saveEvent( newEventForm)" type="submit" class="btn btn-primary">Save</button>
                <button ng-click="cancelEdit()" type="button" class="btn btn-default">Cancel</button>
            </form>

在代码的第二版中,我没有明确地将事件作为函数参数注入。 但是,当按下提交时,这是saveEvent的代码

$scope.saveEvent = function(newEventForm)
    {
        alert(1);
        alert(newEventForm.$valid);
        if(newEventForm.$valid)
        {
            window.alert('event ' + event.name + ' saved!');
        }
    }

事件未定义。 不应该定义它吗? 如果问题是新手的问题,我们深表歉意。 只是想弄清楚如何通过ng-model创建范围项以及双向绑定是如何工作的。 谢谢 !

更新

h,我应该使用$ scope.event。 然后就可以了。 谢谢,就像我说的那样-这是一个新知识,直到我问了一个问题之后,它才浮现出来:)

视图正在关联范围下创建事件变量,请使用$ scope.event.name。 祝好运

实际上,在html中指定的所有变量或模型都是scope变量。

<div ng-controller="myController" ng-init="name='Hello World'">
    {{name}}
    <button ng-click="myFn(name)"> Click Me </button>
</div>

在此示例中,我启动了一个名为name的变量。 它实际上是一个范围变量。 这段代码实际上会喜欢

myApp.controller("myController", function($scope){
    $scope.name = "Hello World";

    $scope.myFn = function(param){
        // here you can see that your variable name passed from html is same as your scope variable
        if(param == $scope.name){
            alert("Yes, two are equal !!!");
        }
    }
});

这两个是一样的。 您可以使用html或js。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM