Javascript 将输入值传递给$mdDialog

我试图将表单输入传递到对话框（例如标题）。问题是：它没有获取表单

$scope

如果我在控制器中设置

$scope

，它将正常显示（例如，请参阅

$scope.text

）。但是，如果我尝试获取表单

$scope

（请参阅“$scope.tasktTitle”），它就不会显示任何内容。请参阅我的代码：

JavaScript

app.controller('tasksCtrl', ['$scope', '$mdDialog',  function($scope, $mdDialog){


$scope.teste = 'Just a test, dude';

$scope.expandTask = function() {

    $mdDialog.show({
        clickOutsideToClose: true,
        controller: DialogController,
        scope: $scope,
        preserveScope: true,
        templateUrl: 'models/dialog.tmpl.php',
        locals: {
            id: $scope.tasklist.id,
            title: $scope.taskTitle
        }
    });

}

function DialogController($scope, $mdDialog, id, title) {

    $scope.id = id;
    $scope.title = title;

    $scope.hide = function() {
        $mdDialog.hide();
    };

    $scope.cancel = function() {
        $mdDialog.cancel();
      };
}
}]);

HTML

<div class="input-container float-icon" flex="100" layout="row" ng-repeat="task in tasklist">
    <md-input-container flex="100">
        <label>New Task...</label>
        <input type="text" ng-model="taskTitle" name="taskTitle">
        <md-button aria-label="Expandir Tarefa" class="md-icon-button expand-icon" ng-click="expandTask()">
            <md-tooltip hide-sm>Expand Task</md-tooltip>
            <i class="fa fa-expand"></i>
        </md-button>
    </md-input-container>

    {{taskTitle}}

</div>

新任务。。。
扩展任务
{{tasktile}}

您应该将

任务

对象从ng repeat传递到ng click中

对于ex

ng，请单击=“expandTask（$event，task）”

在$mdDialog控制器中，您可以访问该对象：

app.controller('tasksCtrl', ['$scope', '$mdDialog', function ($scope, $mdDialog) {

    $scope.expandTask = function (e, task) {
        //ng-click="expandTask($event, task)"
        $mdDialog.show({
            clickOutsideToClose: true,
            controller: function ($mdDialog) {
                var vm = this;
                vm.task = {};
                vm.task = task;  //your task object from the ng-repeat

                $scope.hide = function () {
                    $mdDialog.hide();
                };
                $scope.cancel = function () {
                    $mdDialog.cancel();
                };
            },
            controllerAs: 'modal',
            templateUrl: 'models/dialog.tmpl.php',
            parent: angular.element(document.body),
            targetEvent: e
        });
    };
}]);

在模态模板中，您将使用controllerAs符号访问任务对象，例如：

 <h1> {{ modal.task.name }} <h1>

{{modal.task.name}

您应该将

任务

对象从ng repeat传递到ng click中

对于ex

ng，请单击=“expandTask（$event，task）”

在$mdDialog控制器中，您可以访问该对象：

app.controller('tasksCtrl', ['$scope', '$mdDialog', function ($scope, $mdDialog) {

    $scope.expandTask = function (e, task) {
        //ng-click="expandTask($event, task)"
        $mdDialog.show({
            clickOutsideToClose: true,
            controller: function ($mdDialog) {
                var vm = this;
                vm.task = {};
                vm.task = task;  //your task object from the ng-repeat

                $scope.hide = function () {
                    $mdDialog.hide();
                };
                $scope.cancel = function () {
                    $mdDialog.cancel();
                };
            },
            controllerAs: 'modal',
            templateUrl: 'models/dialog.tmpl.php',
            parent: angular.element(document.body),
            targetEvent: e
        });
    };
}]);

在模态模板中，您将使用controllerAs符号访问任务对象，例如：

 <h1> {{ modal.task.name }} <h1>

{{modal.task.name}

保持最小值

并动态创建一个带有范围变量的控制器

$scope.expandTask = (e, task) =>
    $mdDialog.show({
        templateUrl: 'dialog.template.html',
        controller: $scope => $scope.taskName = task.name
    })

---

taskName

现在是一个

$scope

变量，可以在对话框模板中使用

并动态创建一个带有范围变量的控制器

$scope.expandTask = (e, task) =>
    $mdDialog.show({
        templateUrl: 'dialog.template.html',
        controller: $scope => $scope.taskName = task.name
    })

taskName

现在是一个

$scope

变量，可以在对话框模板中使用