1

ng グリッドの行にあるボタンをクリックすると、モーダル ポップアップが表示されます。モーダル ポップアップでフォームを取得するには、次のように JSON スキーマを入力します。

モーダルポップアップのHTMLは

<div class="modal-header">
      <h3 class="modal-title">Edit Row</h3>
  </div>
  <div class="modal-body">
    <form sf-schema="schema" sf-form="form" sf-model="entity"></form>
  </div>
  <div class="modal-footer">
      <button class="btn btn-success" ng-click="save()">Save</button>
      <button class="btn btn-warning" ng-click="$close()">Cancel</button>
  </div>
</div>

スキーマは、外部 js ファイルで以下のように定数に入れられます。

var app = angular.module("myApp", ['ngGrid','ui.bootstrap']);
app.constant('UserPopUpSchema', {
    type: 'object',
    properties: {
        FullName: { type: 'string', title: 'FullName' },
        UserName: { type: 'string', title: 'UserName' },
        Password: { type: 'string', title: 'Password' },
        EmailAddress: { type: 'string', title: 'EmailId' },
        Phone: {type:'string',title:'phNum'}
    }
});

そのため、行をクリックng-gridすると、 edit row という関数を実行しています。これにより、ポップアップが開き、定数に従ってフォームに入力されます。

 $scope.editRow = function (grid,row) {
        $modal.open({
            templateUrl: 'PopUpTemplate.htm',
            controller:['$modalInstance', 'grid', 'row','UserPopUpSchema', function($modalInstance,grid,row){

        schema = 'UserPopUpSchema';

         entity = angular.copy(row.entity);
         form = [
           'FullName',
           'UserName',
           'Password',
           'EmailId',
          'phNum'
           ];


            }],
            resolve: {
                grid: function () { return grid; },
                row: function () { return row; }
            }
        });
    };

しかし、ここでは、コントローラー関数に定数を挿入する方法について少し混乱しています。その結果、モーダルは空白のフォームで表示されます。

どんな助けにも感謝します!!

4

3 に答える 3

0

$modal.open() は、必要なすべてのデータを渡すことができる「解決」プロパティを受け入れます。

$modal.open({
    templateUrl: 'templateUrl',
    controller: 'controllerName',
    resolve: {
        data: function(){
            // Here, return a JSON object containing all the data you want to pass to the controller.  
        }
    }
});

次に、コントローラーは次のようになります。

yourApp.controller('controllerName', function ( $scope, $modalInstance, data ){
    // Here, using data, you can access the JSON object you passed previously.
});
于 2015-12-18T13:03:40.053 に答える
0

これを試して

$modal.open({
    templateUrl: 'PopUpTemplate.htm',
    controller: function ($modalInstance, grid, row, UserPopUpSchema) {
     // Do Stuff
    },
    resolve: {
        grid: function () {
            return grid;
        },
        row: function () {
            return row;
        },
        UserPopUpSchema: function () {
            return UserPopUpSchema;
        }
    }
});
于 2015-12-18T12:58:17.557 に答える
0 
 app.controller('Myctrl',function($scope,UserPopUpSchema) {
    $scope.editRow = function (grid,row) {
        $modal.open({
        templateUrl: 'PopUpTemplate.htm',
        controller:['$modalInstance', 'grid', 'row','UserPopUpSchema', function($modalInstance,grid,row){

    schema = 'UserPopUpSchema';

     entity = angular.copy(row.entity);
     form = [
       'FullName',
       'UserName',
       'Password',
       'EmailId',
      'phNum'
       ];


        }],
        resolve: {
            grid: function () { return grid; },
            row: function () { return row; }
            UserPopUpSchema: function () { return UserPopUpSchema; }
        }
    });
};
 });

 and in the modal instance controller inject the UserPopUpSchema along with grid and row
于 2015-12-18T13:02:03.947 に答える