Нажатие не работает в повторной таблице

0

У меня есть aproblem с angularjs ng-click не работает, моя модель не обновляется. Когда я хочу прочитать, переменные модели пустые. Я использую всплывающее окно bootstrap для отображения значений модели (название, действие используется для проверки внутри встроенного контроллера funciton).

HTML-код

    <button ng-click="title = 'Add Project'; action='Add'" data-toggle="modal" data-target="#myModal" id="btnOpenPopUpForAdding" class="btn btn-default" title="Add new project"><span class="glyphicon glyphicon-plus" aria-hidden="true"></span></button>

    <table class="table" id="tblProjects" style="display:none;">
        <thead>
            <tr>
                <th>

                </th>
                <th>
                    Project Name
                </th>
                <th>
                    Project Description
                </th>
            </tr>
        </thead>
        <tr ng-repeat="project in projects" >
            <td>
                <button ng-click="title = 'Update Project'; action='Update'" data-toggle="modal" data-target="#myModal" class="btn btn-default" title="Update project">
                    <span class="glyphicon glyphicon-edit" aria-hidden="true"></span>
                </button>
            </td>
            <td>
                <span>{{project.ProjectName}}</span>
            </td>
            <td>
                <span>{{project.ProjectDescription}}</span>
            </td>
        </tr>
    </table>
    @Html.Partial("../ProjectView")
</div>

Частичный вид

<!-- Modal content-->
    <div class="modal-content">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal">&times;</button>
            <h4 class="modal-title">{{title}}</h4>
        </div>
        <div class="modal-body">
            <label for="txtProjectName">Project Name</label>
            <input ng-model="singleProject.ProjectName" type="text" class="form-control" style="width:65%" id="txtProjectName" placeholder="Type the project name" />
            <br />
            <label for="txtProjectDescription">Project Description</label>
            <textarea ng-model="singleProject.ProjectDescription" class="form-control" style="width:65%" id="txtProjectDescription" placeholder="Type the project description" rows="4"></textarea>
        </div>

        <div class="modal-footer">
            <button id="btnSave" type="button" class="btn btn-primary" ng-click="ThrowEvent()">Save</button>
            <button id="btnCancel" type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
        </div>
    </div>

Код контроллера

$scope.ThrowEvent = function () {
    if ($scope.action == 'Add')
        $scope.AddProject($scope.singleProject);
    if($scope.action == 'Update')
        $scope.UpdateProject($scope.singleProject);
    //if($scope.action == 'Delete')
}
  • 0
    Частичный вид code
  • 0
    Как насчет action='UpdateProject'
Показать ещё 2 комментария

2 ответа

0
Лучший ответ

Проблема в том, что ng-repeat создает отдельные дочерние области. В вашем случае ng-click="title= 'Update Project'; action='Update'" где title и action назначаются дочерней области, а не родительской.

Чтобы исправить это, вы должны префикс вашей модели в своем контроллере, например

$scope.myActions = {title: 'Default Title', action: 'Default action'};

Затем вы можете изменить ng-click="title= 'Update Project'; action='Update'" до ng-click="myActions.title= 'Update Project'; myActions.action='Update'"

  • 0
    Большое спасибо!! сейчас работает нормально.
0

ng-repeat создаст новую область для каждой итерации.

"title= 'Update Project'; action='Update'" будет выполнен успешно, но он будет записывать значения в под-область ng-repeat и не будет отображаться контроллером.

Чтобы решить проблему, вы можете создать контейнер данных в контроллере

$scope.data = {};

и напишите в контейнер

ng-click="data.title = 'Update Project'; data.action='Update'"'

Ещё вопросы

Сообщество Overcoder
Наверх
Меню