在控制器中获取ng-model $资源

时间:2015-07-22 22:53:47

标签: angularjs angular-ngmodel

我需要通过在Dialog中选择一个列出的图像来设置控制器的ng-model,并插入表格的ng-model以将其记录在json-server中。

我的资源由json-server提供。

有没有办法做到这一点?或者没有办法..或其他方式?

模板:

 <form class="form-horizontal" role="form" ng-submit="addItem($stateParams.section)" enctype="multipart/form-data">

<div layout="row" layout-wrap>

<div flex="75">

    <md-card>

        <md-card-content>
            <h2>Adicionar novo Post</h2>

            <md-input-container>
                <label>Digite o título aqui</label>
                <input ng-model="item.title">
            </md-input-container>

            <md-input-container>
                <label>Introdução</label>
                <input ng-model="item.subtitle">
            </md-input-container>

            <md-input-container>
                <label>Link permanente</label>
                <input ng-model="item.slug">
            </md-input-container>


            <text-angular ng-model="item.content"></text-angular>


            <md-input-container>
                <label>Resumo</label>
                <input ng-model="item.excerpt">
            </md-input-container>

        </md-card-content>

    </md-card>

 </div>

 <div flex="25">

    <md-card>

        <md-card-content>

            <h2>Configurações do Post</h2>

            <md-input-container ng-controller="PublishedControl">
                <md-select name="situation" ng-model="item.situation" placeholder="Status do Post">
                    <md-option ng-repeat="pub in publisheds" ng-value="{{pub.id}}">{{pub.name}}</md-option>
                </md-select>
            </md-input-container>

            <div layout layout-sm="column">
                <md-input-container flex>
                    <label>Date</label>
                    <input type="date" ng-model="item.posted">
                </md-input-container>

                <md-input-container flex>
                    <label>Time</label>
                    <input type="time" ng-model="item.posted">
                </md-input-container>
            </div>

            <md-card-footer layout="row" layout-sm="column" layout-align="center center" layout-wrap>

                <md-button class="md-raised md-primary" type="submit">Salvar</md-button>        
                <md-button class="md-raised" ui-sref="listItems({section: $stateParams.section})">Cancelar</md-button>

            </md-card-footer>

        </md-card-content>

    </md-card>

    <md-card ng-if="categorias[0].cats">

        <md-card-content>

            <h2>Categorias</h2>

            <div layout-padding>

                    <!-- <checkbox ng-repeat="cat in categorias[0].cats" value="{{cat.id}}" ng-checked="{{item.cats.indexOf(cat.id) > -1}}" ng-model="item.cats">{{cat.name}}</md-checkbox> -->
                    <label ng-repeat="cat in categorias[0].cats" style="display:block;" layout="row" flex="100">
                        <input type="checkbox" checklist-model="item.cats" checklist-value="cat.id"> {{cat.name}}
                    </label>

            </div>

        </md-card-content>

    </md-card>

    <md-card>

        <md-card-content ng-controller="MediaController">

            <h2>Imagem em Destaque</h2>

            <div class="input-group form-group">
                <figure ng-if="item.image"><img ng-model="item.image" ng-src="item.image" alt=""></figure>
                <md-button class="md-raised" type="button" ng-click="chooseMedia($event)">Escolha uma Imagem</md-button>

            </div>

        </md-card-content>

    </md-card>

</div>

</div>
</form>

控制器:

module.controller('MediaController', ['$scope', '$mdDialog', 'Media', function($scope, $mdDialog, Media) {

$scope.chooseMedia = function(ev){
    $mdDialog.show({
        parent              : angular.element(document.body),
        controller          : chooseMediaControl,
        ariaLabel           : 'Choose Media',
        targetEvent         : ev,
        clickOutsideToClose : true,
        templateUrl         : 'partials/tpl/media.html'
    })

    function chooseMediaControl($scope, $mdDialog, Media) {

        $scope.media = Media.query();

        $scope.cancelMedia = function() {
            $mdDialog.cancel();
        };
        $scope.applyMedia = function() {
            $scope.item.image = $scope.image;
            $mDialog.hide();
        };
        $scope.inserMedia = function(imageurl){
            $scope.image = imageurl;
        };
    }
}

}])

服务:

.factory('Media',function($resource){

    return $resource('http://localhost:5000/media/:id',{id:'@id'},{

        update: {
            method: 'PUT'
        }

    });

})

0 个答案:

没有答案