2016-02-29 28 views
0

UPDATE角模型只有一個的console.log()

我發現,這個問題是不是有角,但在節點服務器控制器的更新功能的錯誤之後更新。解決辦法在下面,我在這裏留下問題來幫助那些可能犯過同樣錯誤的人。當屬性在形式改變

原來的問題

角模式不會改變。代碼:

<section class="container" ng-controller="DjsController" ng-init="findOne()"> 
    <form name="djForm" class="form-horizontal" ng-submit="update(djForm.$valid)" novalidate> 
    <fieldset> 
     <div>.... other form fields </div> 

     <div class="form-group"> 
     <label>Guest:</label> 
     <input name="guest" type="checkbox" ng-model="dj.guest"> 
     </div> 

     <div class="form-group"> 
     <label>Featured:</label> 
     <input name="featured" type="checkbox" ng-model="dj.featured"> 
     </div> 

     <button type="button" ng-click="logDj()">Log it</button> 

     <div class="form-group"> 
     <input type="submit" class="btn btn-default"> 
     </div> 
    </fieldset> 
    </form> 

當我選中該複選框,或者將真或假,並提交表單,原始模型被髮送到服務器,而不是更新。然後我插入ng-click="logDj()來記錄模型,看看發生了什麼。但是,當我點擊它時,模型會更新。我在尋找的是爲什麼這是更詳細的解釋?

這裏是控制器:

angular.module('djs').controller('DjsController', ['$scope', '$stateParams', '$location', 'Authentication', 'Djs', 
    function ($scope, $stateParams, $location, Authentication, Djs) { 
    $scope.authentication = Authentication; 

    // Clear forms 
    $scope.clear = ... 

    // Create new Dj 
    // $scope.create = ... 

    // Remove existing Dj 
    // $scope.remove = ... 

    // Update existing Dj 
    $scope.update = function (isValid) { 
     $scope.error = null; 

     if (!isValid) { 
     $scope.$broadcast('show-errors-check-validity', 'djForm'); 

     return false; 
     } 
     // shows original model if logDj() is not fired 
     console.log($scope.dj); 

     var dj = $scope.dj; 

     dj.$update(function() { 

     $location.path('djs/' + dj._id); 

     }, function (errorResponse) { 
     $scope.error = errorResponse.data.message; 
     }); 
    }; 

    // Find a list of Djs 
    //$scope.find = .... 

    // Find existing Dj 
    $scope.findOne = function() { 
     $scope.dj = Djs.get({ 
     djId: $stateParams.djId 
     }); 
    }; 

    $scope.logDj = function() { 
     console.log($scope.dj); 
    }; 
    } 
]); 

我想也許是因爲財產不曾存在的,它可能會導致這種現象,但填充的財產,即使檢索時,模型拒絕改變。

我使用Yeoman的MEAN.JS的默認設置;如果這有幫助的話。

編輯 這隻影響複選框。其他字段會更改模型值。

+1

我的第一個想法是,這是一個範圍問題。你能在這發生的地方創造一個小提琴嗎? – erichardson30

+0

感謝您的幫助。我發現這不是Angular的問題,而是我的服務器端代碼。答案如下。 – shteeven

回答

0

圍繞以下數據後,它經過更新道瓊斯模型的過程中,我發現我失蹤了。它與Angular無關,而是節點中的server.controller。雖然create函數未經修改即可正常工作,但控制器中的更新函數必須更新以匹配模型。當PUT請求被髮送時,當有效的ID在參數中時,中間用Dj模型填充req。

var djsPolicy = require('../policies/djs.server.policy'), 
    djs = require('../controllers/djs.server.controller'); 

module.exports = function (app) { 
    // Djs collection routes 
    app.route('/api/djs').all(djsPolicy.isAllowed) 
    .get(djs.list) 
    .post(djs.create); 

    // Single dj routes 
    app.route('/api/djs/:djId').all(djsPolicy.isAllowed) 
    .get(djs.read) 
    .put(djs.update) 
    .delete(djs.delete); 

    // Finish by binding the dj middleware 
    app.param('djId', djs.djByID); // HERE! }; 

這是然後傳遞到更新功能,在那裏我應該在請求主體與那些在道瓊斯模型具有匹配的字段。原代碼:

exports.update = function (req, res) { 

    var dj = req.dj; 

    dj.title = req.body.title; 
    dj.content = req.body.content; 

    dj.save(function (err) { 
    if (err) { 
     return res.status(400).send({ 
     message: errorHandler.getErrorMessage(err) 
     }); 
    } else { 
     res.json(dj); 
    } 
    }); 
}; 

原代碼也有外地的標題,這使得它看起來好像在瀏覽器中測試和改變這個領域在更新功能工作正常,但標誌着複選框時失敗。工作代碼是:

exports.update = function (req, res) { 
    var dj = req.dj; 

    dj.title = req.body.title; 
    dj.image = req.body.image; 
    dj.images = req.body.images; 
    dj.links = req.body.links; 
    dj.categories = req.body.categories; 
    dj.description = req.body.description; 
    dj.guest = req.body.guest; 
    dj.featured = req.body.featured; 

    dj.save(function (err) { 
    if (err) { 
     return res.status(400).send({ 
     message: errorHandler.getErrorMessage(err) 
     }); 
    } else { 
     res.json(dj); 
    } 
    }); 
}; 
1

只是我的猜測,嘗試在訪問它之前初始化對象;目前還不清楚如何設置其他字段(效果),也許他們在範圍上直接設置,不屬於DJ命名空間

$scope.authentication = Authentication; 
$scope.dj = {}; 
. 
. 
. 
$scope.update = function (isValid) { 
    var dj = $scope.dj; 

驗證,更新方法中添加一條線調試,並檢查DJ目的;

$scope.update = function (isValid) { 
    debugger; // it should create a breakpoint in chrome dev tools 
    var dj = $scope.dj; 

希望這有助於

相關問題