如何使用$ resource,从哪里开始

时间:2017-01-08 18:45:31

标签: angularjs django rest

我想了解$ resource,但不知道从哪里开始。 我正在尝试使用REST API将数据保存到数据库中。

这是我的表格:

<ion-view title="Add New Device" ng-controller="addDevice">
<ion-content>
    <form name="addDeviceForm" ng-init="setFormScope(this)" data-ng-submit="deviceSubmit()">
        <div class="list" style="background:#ffffff;">
            <div class="item item-divider">
                Device Info
            </div>
            <label class="item item-input item-stacked-label">
                <span class="input-label">Name</span>
                <input type="text" placeholder="Name" ng-model="newDevice.name">
            </label>
            <label class="item item-input item-stacked-label">
                <span class="input-label">Icon</span>
                <input type="text" placeholder="Icon" ng-model="newDevice.icon">
                <select ng-model="newDevice.icon" ng-options="ionicon.name for ionicon in ionicons"></select>
            </label>

            <div class="item item-divider">
                Location
            </div>
            <label class="item item-input item-select">
                <div class="input-label">
                    Select a Location
                </div>
                <select ng-model="newDevice.locationSelect" ng-options="o.id as o.name for o in locations"></select>
            </label>
            <div class="item item-divider">
                Select Action
            </div>
            <label class="item item-input item-select">
                <div class="input-label">
                    Action
                </div>
                <select ng-model="newDevice.actionSelect" ng-options="o.id as o.name for o in actions"></select>
            </label>
            <div class="item item-divider">
                Featured
            </div>
            <li class="item item-toggle">
                Featured
                <label class="toggle toggle-balanced">
                    <input type="checkbox" checked ng-model="newDevice.featured">
                    <div class="track">
                        <div class="handle"></div>
                    </div>
                </label>
            </li>
        </div>
        <div class="padding">
            <button class="button button-balanced" ng-click="">
                Add Device
            </button>
        </div>
    </form>
</ion-content>

然后这是我的角度代码,但是现在如果我添加数据,它们只会被添加到缓存中,如果我刷新它们将被刷新,所以我想在DB中进行永久性更改,添加数据。

.controller('addDevice', function ($scope) {
    $scope.setFormScope = function (scope) {
        this.formScope = scope;
    };
    $scope.newDevice = {};
    $scope.deviceSubmit = function () {

        if (!$scope.newDevice.name) {
            $scope.showAlert('Name Required');
            return;
        }
        if (!$scope.newDevice.icon) {
            $scope.newDevice.icon = 'ion-ios7-lightbulb-outline';
        }
        if ($scope.newDevice) {
            $scope.showAlert('Device Added');
        }
        $scope.newDevice.id = $scope.devices.length + 2;
        $scope.devices.push($scope.newDevice);
        this.formScope.addDeviceForm.$setPristine();
        var defaultForm = {
            id: "",
            name: "",
            icon: "",
            status: "",
            color: "",
            userSelect: "",
            actionSelect: "",
            locationSelect: ""
        };
        $scope.newDevice = defaultForm;
    };
})

这也是路径/ api / devices /接受GET POST OPTION和HEAD 这就是它应该是这样的:

{         “名字”:“某事”,         “主持人”:“某事”,         “icon”:“某事”,         “身份”:“某事”,         “精选”:布尔,         “pin”:1     }

我应该从哪里开始:( 谢谢

1 个答案:

答案 0 :(得分:0)

这是我必须做的,而且有效。

   var deviceResource = $resource('/api/devices/');
            deviceResource.save($scope.newDevice, onSuccess, onError);

            function onSuccess(data) {
                $scope.showAlert('Device Added');
            }

            function onError(data) {
                console.dir(data);
            }