自动推送数据
Automatically Pushing Data
好的大家好。这里的问题是..让我在案例中解释一下（顺便说一句，我正在创建一个论坛）：
所以假设用户让他命名为 John。约翰决定登录并创建一个新主题。好的，太棒了，只要他点击提交新主题，我就会推送数据，用户可以看到。都好。现在让我们命名另一个名为 Peter 的用户。在 John 发布他的新主题后，Peter 决定登录。所以现在这里是问题。彼得一登录。您看到约翰发布的重复主题！！！？应用程序中也发生了同样的事情。当其他人登录时自动将其推送到我的数据库。相信我，我做了很多调试和解决问题的工作。但无法弄清楚这个案子。我在这里请求帮助。所以我在这里编写实际代码：
https://ide.c9.io/amanuel2/fourm2
这样我们就可以在那里见面并查看代码和结果。这也是我的 AuthHomeCtrl.js 事件发生的地方（根据我的调试）：
(function(angular) {
var app = angular.module('ForumApp');
app.controller('authHome', ["$scope", "$firebaseObject", "$state", "$mdDialog", "$mdMedia", "$firebaseArray", function($scope, $firebaseObject, $state, $mdDialog, $mdMedia, $firebaseArray) {
//Debugging...
// $state.go('authHome.desc')
var ref = new Firebase('https://uniquecodersforum.firebaseio.com/')
var auth = ref.getAuth() ? console.log() : $state.go("home")
ref.onAuth(function(authData) {
var obj = $firebaseObject(ref.child("UserAuthInfo").child(authData.uid));
obj.$loaded(function(data) {
console.log(data)
$scope.Username = data.Username;
$scope.Email = data.Email;
$scope.UID = authData.uid;
$scope.image = data.Image;
},
function(error) {
console.error("Error:", error);
}
);
})
$scope.openMenu = function($mdOpenMenu, ev) {
//DEBUGING
console.log("IS IN MD-OPEN MENU FUNCTION")
$mdOpenMenu(ev);
}
$scope.logout = function() {
//DEBUGING
console.log("IS IN MD-OPEN LOGOUT FUNCTION")
$state.go("home");
window.location.href = "#home"
ref.unauth();
location.reload(true);
location.reload(true);
}
$scope.showNewTopic = function(ev) {
if (ev) {
var useFullScreen = ($mdMedia('sm') || $mdMedia('xs')) && $scope.customFullscreen;
$mdDialog.show({
controller: function($scope, $mdDialog) {
var ref = new Firebase('https://uniquecodersforum.firebaseio.com/')
$scope.hide = function() {
$mdDialog.hide();
};
$scope.cancel = function() {
$mdDialog.cancel();
};
$scope.answer = function(answer) {
$mdDialog.hide(answer);
};
$scope.submitNewTopic = function(title, sentence) {
console.log(title, sentence)
ref.onAuth(function(authData) {
ref.child("UserAuthInfo").child(authData.uid).on("value", function(snapshot) {
$scope.userAvatar = snapshot.val().Image;
$scope.userName = snapshot.val().Username;
$scope.userEmail = snapshot.val().Email;
})
ref.child("Topics").push({
Title: title,
Value: sentence,
DateCreated: Date.now(),
Username: $scope.userName,
Email: $scope.userEmail,
Avatar: $scope.userAvatar,
UID: authData.uid
})
})
$mdDialog.hide();
}
},
templateUrl: 'views/newTopic.html',
parent: angular.element(document.body),
targetEvent: ev,
clickOutsideToClose: true,
fullscreen: useFullScreen
})
.then(function(answer) {
$scope.status = 'You said the information was "' + answer + '".';
}, function() {
$scope.status = 'You cancelled the dialog.';
});
}
else {
}
}
}])
})(angular);
非常感谢您的帮助！感谢阅读。
编辑
好的，这是解决@Varel 问题。他说有一个控制器和一个函数内部就够了（对于连续的三个函数）。所以我提取了它....让我们看看：
index.html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<title>Unique Coders</title>
<!-- Javascript Libraries -->
<script src="bower_components/jquery/dist/jquery.js"></script>
<script src="bower_components/angular/angular.js"></script>
<script src="bower_components/angular-ui-router/release/angular-ui-router.js"></script>
<script src="bower_components/angular-material/angular-material.js"></script>
<script src="bower_components/angular-animate/angular-animate.js"></script>
<script src="bower_components/angular-aria/angular-aria.js"></script>
<script src="bower_components/angular-messages/angular-messages.js"></script>
<script type="text/javascript" src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/t-114/svg-assets-cache.js"></script>
<script src="bower_components/firebase/firebase.js"></script>
<script src="bower_components/angularfire/dist/angularfire.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.1/js/materialize.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/angular-material-icons/0.7.0/angular-material-icons.min.js"></script>
<script src="node_modules/alertifyjs/build/alertify.js"></script>
<!-- Styles -->
<link rel="stylesheet" href="bower_components/angular-material/angular-material.css"/>
<link rel="stylesheet" href="node_modules/alertifyjs/build/css/alertify.css" />
<link rel="stylesheet" href="node_modules/alertifyjs/build/css/themes/default.min.css" />
<link rel="icon shortcut" href="views/assets/images/favicon.ico">
<!-- Controllers And App -->
<script type="text/javascript" src="script.js"></script>
<script type="text/javascript" src="router/mainRouter.js"></script>
<script type="text/javascript" src="controllers/homeCtrl.js"></script>
<script type="text/javascript" src="controllers/newTopicCtrl.js"></script>
<script type="text/javascript" src="controllers/authDescCtrl.js"></script>
<script type="text/javascript" src="controllers/topicCtrl.js"></script>
<script type="text/javascript" src="controllers/loginCtrl.js"></script>
<script type="text/javascript" src="controllers/authHomeCtrl.js"></script>
<script type="text/javascript" src="controllers/registerCtrl.js"></script>
<script type="text/javascript" src="controllers/topicCtrl.js"></script>
</head>
<body ng-app="ForumApp">
<div id="page">
<div ui-view>
</div>
</div>
</body>
</html>
authHomeCtrl.js:
(function(angular) {
var app = angular.module('ForumApp');
app.controller('authHome', ["$scope", "$firebaseObject", "$state", "$mdDialog", "$mdMedia", "$firebaseArray", function($scope, $firebaseObject, $state, $mdDialog, $mdMedia, $firebaseArray) {
// $state.go('authHome.desc')
var ref = new Firebase('https://uniquecodersforum.firebaseio.com/')
var auth = ref.getAuth() ? console.log() : $state.go("home")
ref.onAuth(function(authData) {
var obj = $firebaseObject(ref.child("UserAuthInfo").child(authData.uid));
obj.$loaded(function(data) {
console.log(data)
$scope.Username = data.Username;
$scope.Email = data.Email;
$scope.UID = authData.uid;
$scope.image = data.Image;
},
function(error) {
console.error("Error:", error);
}
);
})
$scope.openMenu = function($mdOpenMenu, ev) {
//DEBUGING
console.log("IS IN MD-OPEN MENU FUNCTION")
$mdOpenMenu(ev);
}
$scope.logout = function() {
//DEBUGING
console.log("IS IN MD-OPEN LOGOUT FUNCTION")
$state.go("home");
window.location.href = "#home"
ref.unauth();
location.reload(true);
location.reload(true);
}
$scope.showNewTopic = function(ev) {
if (ev) {
var useFullScreen = ($mdMedia('sm') || $mdMedia('xs')) && $scope.customFullscreen;
$mdDialog.show({
controller: newTopicCtrl,
templateUrl: 'views/newTopic.html',
parent: angular.element(document.body),
targetEvent: ev,
clickOutsideToClose: true,
fullscreen: useFullScreen
})
.then(function(answer) {
$scope.status = 'You said the information was "' + answer + '".';
}, function() {
$scope.status = 'You cancelled the dialog.';
});
}
else {
}
}
}])
})(angular);
NewTopicCtrl.js:
(function(angular) {
var app = angular.module('ForumApp')
app.controller('newTopicCtrl', ["$scope", "$mdDialog", function($scope,$mdDialog) {
var ref = new Firebase('https://uniquecodersforum.firebaseio.com/')
$scope.hide = function() {
$mdDialog.hide();
};
$scope.cancel = function() {
$mdDialog.cancel();
};
$scope.answer = function(answer) {
$mdDialog.hide(answer);
};
$scope.submitNewTopic = function(title, sentence) {
console.log(title, sentence)
ref.onAuth(function(authData) {
ref.child("UserAuthInfo").child(authData.uid).on("value", function(snapshot) {
$scope.userAvatar = snapshot.val().Image;
$scope.userName = snapshot.val().Username;
$scope.userEmail = snapshot.val().Email;
})
ref.child("Topics").push({
Title: title,
Value: sentence,
DateCreated: Date.now(),
Username: $scope.userName,
Email: $scope.userEmail,
Avatar: $scope.userAvatar,
UID: authData.uid
})
})
$mdDialog.hide();
}
}])
})(angular);
GET源数据图片：
最后我改成那个错误时遇到的错误：
error:angular.js:13424 ReferenceError: newTopicCtrl is not defined at Scope.$scope.showNewTopic (authHomeCtrl.js:52) at fn (eval at compile (angular.js:14268), <anonymous>:4:331) at expensiveCheckFn (angular.js:15281) at callback (angular.js:24808) at Scope.$eval (angular.js:17025) at Scope.$apply (angular.js:17125) at HTMLButtonElement.<anonymous> (angular.js:24813) at HTMLButtonElement.dispatch (jquery.js:4737) at HTMLButtonElement.elemData.handle (jquery.js:4549)
此代码唯一真正的问题（编辑前关于问题的第一个示例文件）是执行 mdModal 的代码也会触发提交操作。明智的做法是将逻辑分离到实际的不同控制器中，而不是使用匿名函数来定义它们。
在建议将其提取到单独的控制器后的给定示例中，authHomeCtrl 中的模态控制器定义缺少 newTopicCtrl 周围的引号，这会导致抛出异常。简单的错字问题。
好的大家好。这里的问题是..让我在案例中解释一下（顺便说一句，我正在创建一个论坛）：
所以假设用户让他命名为 John。约翰决定登录并创建一个新主题。好的，太棒了，只要他点击提交新主题，我就会推送数据，用户可以看到。都好。现在让我们命名另一个名为 Peter 的用户。在 John 发布他的新主题后，Peter 决定登录。所以现在这里是问题。彼得一登录。您看到约翰发布的重复主题！！！？应用程序中也发生了同样的事情。当其他人登录时自动将其推送到我的数据库。相信我，我做了很多调试和解决问题的工作。但无法弄清楚这个案子。我在这里请求帮助。所以我在这里编写实际代码：
https://ide.c9.io/amanuel2/fourm2
这样我们就可以在那里见面并查看代码和结果。这也是我的 AuthHomeCtrl.js 事件发生的地方（根据我的调试）：
(function(angular) {
var app = angular.module('ForumApp');
app.controller('authHome', ["$scope", "$firebaseObject", "$state", "$mdDialog", "$mdMedia", "$firebaseArray", function($scope, $firebaseObject, $state, $mdDialog, $mdMedia, $firebaseArray) {
//Debugging...
// $state.go('authHome.desc')
var ref = new Firebase('https://uniquecodersforum.firebaseio.com/')
var auth = ref.getAuth() ? console.log() : $state.go("home")
ref.onAuth(function(authData) {
var obj = $firebaseObject(ref.child("UserAuthInfo").child(authData.uid));
obj.$loaded(function(data) {
console.log(data)
$scope.Username = data.Username;
$scope.Email = data.Email;
$scope.UID = authData.uid;
$scope.image = data.Image;
},
function(error) {
console.error("Error:", error);
}
);
})
$scope.openMenu = function($mdOpenMenu, ev) {
//DEBUGING
console.log("IS IN MD-OPEN MENU FUNCTION")
$mdOpenMenu(ev);
}
$scope.logout = function() {
//DEBUGING
console.log("IS IN MD-OPEN LOGOUT FUNCTION")
$state.go("home");
window.location.href = "#home"
ref.unauth();
location.reload(true);
location.reload(true);
}
$scope.showNewTopic = function(ev) {
if (ev) {
var useFullScreen = ($mdMedia('sm') || $mdMedia('xs')) && $scope.customFullscreen;
$mdDialog.show({
controller: function($scope, $mdDialog) {
var ref = new Firebase('https://uniquecodersforum.firebaseio.com/')
$scope.hide = function() {
$mdDialog.hide();
};
$scope.cancel = function() {
$mdDialog.cancel();
};
$scope.answer = function(answer) {
$mdDialog.hide(answer);
};
$scope.submitNewTopic = function(title, sentence) {
console.log(title, sentence)
ref.onAuth(function(authData) {
ref.child("UserAuthInfo").child(authData.uid).on("value", function(snapshot) {
$scope.userAvatar = snapshot.val().Image;
$scope.userName = snapshot.val().Username;
$scope.userEmail = snapshot.val().Email;
})
ref.child("Topics").push({
Title: title,
Value: sentence,
DateCreated: Date.now(),
Username: $scope.userName,
Email: $scope.userEmail,
Avatar: $scope.userAvatar,
UID: authData.uid
})
})
$mdDialog.hide();
}
},
templateUrl: 'views/newTopic.html',
parent: angular.element(document.body),
targetEvent: ev,
clickOutsideToClose: true,
fullscreen: useFullScreen
})
.then(function(answer) {
$scope.status = 'You said the information was "' + answer + '".';
}, function() {
$scope.status = 'You cancelled the dialog.';
});
}
else {
}
}
}])
})(angular);
非常感谢您的帮助！感谢阅读。
编辑
好的，这是解决@Varel 问题。他说有一个控制器和一个函数内部就够了（对于连续的三个函数）。所以我提取了它....让我们看看：
index.html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<title>Unique Coders</title>
<!-- Javascript Libraries -->
<script src="bower_components/jquery/dist/jquery.js"></script>
<script src="bower_components/angular/angular.js"></script>
<script src="bower_components/angular-ui-router/release/angular-ui-router.js"></script>
<script src="bower_components/angular-material/angular-material.js"></script>
<script src="bower_components/angular-animate/angular-animate.js"></script>
<script src="bower_components/angular-aria/angular-aria.js"></script>
<script src="bower_components/angular-messages/angular-messages.js"></script>
<script type="text/javascript" src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/t-114/svg-assets-cache.js"></script>
<script src="bower_components/firebase/firebase.js"></script>
<script src="bower_components/angularfire/dist/angularfire.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.1/js/materialize.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/angular-material-icons/0.7.0/angular-material-icons.min.js"></script>
<script src="node_modules/alertifyjs/build/alertify.js"></script>
<!-- Styles -->
<link rel="stylesheet" href="bower_components/angular-material/angular-material.css"/>
<link rel="stylesheet" href="node_modules/alertifyjs/build/css/alertify.css" />
<link rel="stylesheet" href="node_modules/alertifyjs/build/css/themes/default.min.css" />
<link rel="icon shortcut" href="views/assets/images/favicon.ico">
<!-- Controllers And App -->
<script type="text/javascript" src="script.js"></script>
<script type="text/javascript" src="router/mainRouter.js"></script>
<script type="text/javascript" src="controllers/homeCtrl.js"></script>
<script type="text/javascript" src="controllers/newTopicCtrl.js"></script>
<script type="text/javascript" src="controllers/authDescCtrl.js"></script>
<script type="text/javascript" src="controllers/topicCtrl.js"></script>
<script type="text/javascript" src="controllers/loginCtrl.js"></script>
<script type="text/javascript" src="controllers/authHomeCtrl.js"></script>
<script type="text/javascript" src="controllers/registerCtrl.js"></script>
<script type="text/javascript" src="controllers/topicCtrl.js"></script>
</head>
<body ng-app="ForumApp">
<div id="page">
<div ui-view>
</div>
</div>
</body>
</html>
authHomeCtrl.js:
(function(angular) {
var app = angular.module('ForumApp');
app.controller('authHome', ["$scope", "$firebaseObject", "$state", "$mdDialog", "$mdMedia", "$firebaseArray", function($scope, $firebaseObject, $state, $mdDialog, $mdMedia, $firebaseArray) {
// $state.go('authHome.desc')
var ref = new Firebase('https://uniquecodersforum.firebaseio.com/')
var auth = ref.getAuth() ? console.log() : $state.go("home")
ref.onAuth(function(authData) {
var obj = $firebaseObject(ref.child("UserAuthInfo").child(authData.uid));
obj.$loaded(function(data) {
console.log(data)
$scope.Username = data.Username;
$scope.Email = data.Email;
$scope.UID = authData.uid;
$scope.image = data.Image;
},
function(error) {
console.error("Error:", error);
}
);
})
$scope.openMenu = function($mdOpenMenu, ev) {
//DEBUGING
console.log("IS IN MD-OPEN MENU FUNCTION")
$mdOpenMenu(ev);
}
$scope.logout = function() {
//DEBUGING
console.log("IS IN MD-OPEN LOGOUT FUNCTION")
$state.go("home");
window.location.href = "#home"
ref.unauth();
location.reload(true);
location.reload(true);
}
$scope.showNewTopic = function(ev) {
if (ev) {
var useFullScreen = ($mdMedia('sm') || $mdMedia('xs')) && $scope.customFullscreen;
$mdDialog.show({
controller: newTopicCtrl,
templateUrl: 'views/newTopic.html',
parent: angular.element(document.body),
targetEvent: ev,
clickOutsideToClose: true,
fullscreen: useFullScreen
})
.then(function(answer) {
$scope.status = 'You said the information was "' + answer + '".';
}, function() {
$scope.status = 'You cancelled the dialog.';
});
}
else {
}
}
}])
})(angular);
NewTopicCtrl.js:
(function(angular) {
var app = angular.module('ForumApp')
app.controller('newTopicCtrl', ["$scope", "$mdDialog", function($scope,$mdDialog) {
var ref = new Firebase('https://uniquecodersforum.firebaseio.com/')
$scope.hide = function() {
$mdDialog.hide();
};
$scope.cancel = function() {
$mdDialog.cancel();
};
$scope.answer = function(answer) {
$mdDialog.hide(answer);
};
$scope.submitNewTopic = function(title, sentence) {
console.log(title, sentence)
ref.onAuth(function(authData) {
ref.child("UserAuthInfo").child(authData.uid).on("value", function(snapshot) {
$scope.userAvatar = snapshot.val().Image;
$scope.userName = snapshot.val().Username;
$scope.userEmail = snapshot.val().Email;
})
ref.child("Topics").push({
Title: title,
Value: sentence,
DateCreated: Date.now(),
Username: $scope.userName,
Email: $scope.userEmail,
Avatar: $scope.userAvatar,
UID: authData.uid
})
})
$mdDialog.hide();
}
}])
})(angular);
GET源数据图片：
最后我改成那个错误时遇到的错误：
error:angular.js:13424 ReferenceError: newTopicCtrl is not defined at Scope.$scope.showNewTopic (authHomeCtrl.js:52) at fn (eval at compile (angular.js:14268), <anonymous>:4:331) at expensiveCheckFn (angular.js:15281) at callback (angular.js:24808) at Scope.$eval (angular.js:17025) at Scope.$apply (angular.js:17125) at HTMLButtonElement.<anonymous> (angular.js:24813) at HTMLButtonElement.dispatch (jquery.js:4737) at HTMLButtonElement.elemData.handle (jquery.js:4549)
此代码唯一真正的问题（编辑前关于问题的第一个示例文件）是执行 mdModal 的代码也会触发提交操作。明智的做法是将逻辑分离到实际的不同控制器中，而不是使用匿名函数来定义它们。
在建议将其提取到单独的控制器后的给定示例中，authHomeCtrl 中的模态控制器定义缺少 newTopicCtrl 周围的引号，这会导致抛出异常。简单的错字问题。