如何在Angularjs中显示烤面包机的信息？
如何在Angularjs中显示烤面包机的信息？
提问于 2017-04-11 04:23:42
你好，我正在开发Angularjs应用程序。我正试图在我的角度控制器中显示烤面包机的信息。我推荐了http://angular-js.in/angular-toastr/。我面临以下问题。我无法调用成功，信息等通知从控制器和我没有读取属性‘成功’的未定义的错误。我试过如下。
在index.html中，我添加了下面的代码。
<!--Toaster-->
<script src="https://unpkg.com/angular-toastr/dist/angular-toastr.tpls.js"></script>
<link rel="stylesheet" href="https://unpkg.com/angular-toastr/dist/angular-toastr.css" />
<!--Toaster--> 这是我的main.js
var app = angular.module('RoslpApp', ['pascalprecht.translate', 'ui.router', 'toastr']);
app.config(function ($stateProvider, $urlRouterProvider, $urlRouterProvider, $translateProvider, $translatePartialLoaderProvider) {
//ui-routing states here});
app.controller('RoslpAppController', ['$scope', '$translate', function ($scope, $translate, toastr) {
toastr.success('Hello world!', 'Toastr fun!');
$scope.clickHandler = function (key) {
$translate.use(key);
};
}]);我能知道我为什么在这里面临问题吗？任何帮助都将不胜感激。谢谢
回答 3
Stack Overflow用户
回答已采纳
发布于 2017-04-11 04:27:30
将toastr作为字符串依赖项添加到控制器。
改变这个
app.controller('RoslpAppController', ['$scope', '$translate',function ($scope, $translate, toastr) {到这个
app.controller('RoslpAppController', ['$scope', '$translate','toastr',function ($scope, $translate, toastr) {Stack Overflow用户
发布于 2017-04-11 04:26:24
控制器定义中缺少toastr。
app.controller('RoslpAppController', ['$scope', '$translate','toastr', function ($scope, $translate, toastr) {Stack Overflow用户
发布于 2017-04-11 04:32:35
尝尝这个
<html>
<head>
<script Src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.1/angular.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/toastr.js/1.3.1/js/toastr.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/1.3.1/css/toastr.css">
<script>
var app=angular.module("myapp", []);
app.controller("namesctrl", function($scope){
$(function () {
$('#error').click(function () {
// make it not dissappear
toastr.error("Noooo oo oo ooooo!!!", "Title", {
"timeOut": "0",
"extendedTImeout": "0"
});
});
$('#info').click(function () {
// title is optional
toastr.info("Info Message", "Title");
});
$('#warning').click(function () {
toastr.warning("Warning");
});
$('#success').click(function () {
toastr.success("YYEESSSSSSS");
});
});
});
</script>
</head>
<body ng-app="myapp" ng-controller="namesctrl">
<input type="button" value="Error" id="error" />
<input type="button" value="Info" id="info" />
<input type="button" value="Warning" id="warning" />
<input type="button" value="Success" id="success" />
<br><br><br><br>
See official example: <a href='http://codeseven.github.io/toastr/demo.html' target='blank'>Here</a>
</body>
</html>
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/43336742
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号