简体   繁体   English

如何将提交功能添加到我的ng-controller

[英]How to add submit function to my ng-controller

I am trying to learn angular so forgive my stupid mistakes and ignorance. 我正在尝试学习有角度的知识,以便原谅我的愚蠢错误和无知。 That being said, I add data to my scope when I create my controller ProducerCtrl. 话虽如此,当我创建控制器ProducerCtrl时,我将数据添加到了作用域中。 This works before I add anything else. 在添加其他内容之前,此方法有效。 When I add the addname function it breaks my data fetch. 当我添加addname函数时,它将中断我的数据获取。 I am sure I am doing something wrong because I don't know what I am doing. 我确定自己做错了事,因为我不知道自己在做什么。 I would like to have these two bits of code work. 我想要这两个代码工作。 Maybe I need to move one or both to another area. 也许我需要将一个或两个都移到另一个区域。

<html><head>
    <title></title>
    <script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.1/angular.min.js"></script>
<script>
var eventApp = angular.module('eventApp', []);

var szAction = "/GoGetData";
var szAction2 = "/GoPostData" })";

eventApp.controller('ProducerCtrl', ['$scope', '$http', function (scope, http) {
    http.get(szAction).success(function (data) {
        scope.producer = data;
    });

    $scope.addName = function () {
        http.post(szAction2, scope.producer);

    };
}]);
</script>
</head>
<body>
<div ng-app="eventApp">
    <div ng-controller="ProducerCtrl">
        Name:<input ng-model="producer.Name" type="text" /><br>
        Hello {{producer.Name}}

        <form ng-submit="addName()">
            <input ng-model="producer.Name" type="text">
            <input type="submit" value="add">
        </form>
    </div>
</div>
</body></html>

I've made some changes on your code. 我对您的代码进行了一些更改。 When you click on add will prompt an alert. 当您单击添加时,将提示警报。

Your HTML: 您的HTML:

<body>
    <div ng-app="eventApp">
        <div ng-controller="ProducerCtrl">
            Name:<input ng-model="producer.Name" type="text" /><br />
            Hello {{producer.Name}}

            <form ng-submit="addName()">
                <input ng-model="producer.Name" type="text" />
                <input type="submit" value="add" />
            </form>
        </div>
    </div>
<body>

Your Angular code: 您的Angular代码:

var eventApp = angular.module('eventApp', []);

eventApp.controller('ProducerCtrl', ['$scope', '$http', function ($scope, $http) {
    $scope.producer = { Name : '' };

    $scope.addName = function () {
        alert($scope.producer.Name);
    };
}]);

See here . 这里

Take a look here to check $http. 在这里查看$ http。

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

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