Angularjs Связать данные с меткой и передать в форму - PullRequest
Новая
       14

Angularjs Связать данные с меткой и передать в форму

0 голосов
/ 29 января 2020

Я пытаюсь связать входные данные с тегом метки, а также использую ту же модель ng в методе публикации, но одновременно работает только одна вещь, когда я пытаюсь передать метод публикации для метки, он не работает. из-за этого у меня проблема с удалением элемента со странным идентификатором

- Просмотр кода - 

<div class="row">
    <div ng-app="learning" ng-controller="LearnController">
        <br />  
        <form  method="post" ng-submit="submitStudnetForm()">
            <label>Your ID: {{uId}}</label>
            <input class="form-control " type="text" ng-model="uId" name="CustomerId" />

            <label>Your Name: {{uName}}</label>
            <input type="text" ng-model="uName" class="form-control " name="Name" />

            <label>Your Country: {{uCountry}}</label>
            <input type="text" ng-model="uCountry" class="form-control " name="Country"/>

            <input type="submit" value="Create" />
            <a href="~/Home/Delete/{{uId}}" class="btn btn-danger">Delete</a>
        </form>
    </div>
</div>

- Сценарий - 

//1. create app module
var studentApp = angular.module('learning', []);

//2. create controller
studentApp.controller("LearnController", function ($scope, $http) {

    //3. attach originalStudent model object
    $scope.originalStudent = {
        CustomerId: uId,
        Name: uName,
        Country: uCountry,           
    };

    //4. copy originalStudent to student. student will be bind to a form
    $scope.student = angular.copy($scope.originalStudent);

    //5. create submitStudentForm() function. This will be called when user submits the form
    $scope.submitStudnetForm = function () {
        var onSuccess = function (data, status, headers, config) {
            alert('Student saved successfully.');
        };
        var onError = function (data, status, headers, config) {
            alert('Error occured.');
        }
        console.log($scope.student)
        $http.post('/Home/Index', { customer:$scope.student })
            .success(onSuccess)
            .error(onError);
    };

    //6. create resetForm() function. This will be called on Reset button click.
    $scope.resetForm = function () {
        $scope.student = angular.copy($scope.OriginalStudent);
    };
});

enter image description here

1 Ответ

0 голосов
/ 29 января 2020

Это переменные области видимости -

Замените ваш сегмент кода следующим 

$scope.originalStudent = {
                CustomerId: $scope.uId,
                Name: $scope.uName,
                Country: $scope.uCountry,

            };

Как указано в комментарии, ng-модель для ввода должна быть student.uId, student.uName, student.uCountry

Обновлен HTML код - 

<div class="row">
    <div ng-app="learning" ng-controller="LearnController">
        <br />  
        <form  method="post" ng-submit="submitStudnetForm()">
            <label>Your ID: {{student.uId}}</label>
            <input class="form-control " type="text" ng-model="student.uId" name="CustomerId" />

            <label>Your Name: {{student.uName}}</label>
            <input type="text" ng-model="student.uName" class="form-control " name="Name" />

            <label>Your Country: {{student.uCountry}}</label>
            <input type="text" ng-model="student.uCountry" class="form-control " name="Country"/>

            <input type="submit" value="Create" />
            <a href="~/Home/Delete/{{student.uId}}" class="btn btn-danger">Delete</a>
        </form>
    </div>
</div>
...