DART 语言通知 - html / browser / webkit / Desktop答案

【问题标题】：Notification at DART lang - html / browser / webkit / DesktopDART 语言通知 - html / browser / webkit / Desktop
【发布时间】：2014-09-01 20:57:52
【问题描述】：

我想问一下DART中的正常通知，和here讨论的Chrome Packaged App不同

我创建了以下代码，浏览器 [DARTIUM] 按预期请求许可，但两种情况下的响应（允许/拒绝）在控制台中都显示为“默认”，并且没有出现通知。

{

 void main() {
    Notification.requestPermission().then((String permission) {
     print(permission);   // ==> This is always = "default" for both Allow and Deny
   if (permission == "default") {
       print('permission granted');
       var notification = new Notification('hello');
     }
 else print('sorry no permission!');
}); 
}

任何想法！谢谢

【问题讨论】：

标签： dart dart-html

【解决方案1】：

当前编写的代码永远不会显示权限——“默认”表示权限未被允许或拒绝。您应该在显示通知之前检查permission == "granted"。

请记住，通知和检查当前权限存在一个突出的错误，请参阅https://code.google.com/p/dart/issues/detail?id=20585，尽管这可能不会影响您。

【讨论】：

无论我点击什么，它都会将结果显示为“默认”，因此 if (...) 将拥有默认或 !default 权限
您能否发布更完整的代码示例？
实际并没有什么特别之处，我正在尝试的代码只是在运行后发出通知，我对问题陈述进行了少许调整，谢谢
嗯，这很奇怪。 Gunter最初发布了一个答案，说通知需要由用户事件触发，这是真的。根据我的经验，浏览器甚至不会询问您的权限，除非通知请求权限作为用户事件的结果。因此，如果您将该代码放在按钮的单击处理程序中，它应该可以工作。

【解决方案2】：

感谢 Brian 和 Gunter，我收到了自己的通知，灵感来自 this

我使用了相同的 CSS 文件，并创建了一个自定义元素 notification.dart

part of myApp;

class NotificationElement extends HtmlElement {
// Define the custom element tag
static final tag = 'x-Notification';   
factory NotificationElement() => new Element.tag(tag); 
// Create the element and define its stylesheet

NotificationElement.created() : super.created(){
     LinkElement styleSheet = new LinkElement()..rel = "stylesheet"..type="text/css"..href="./style/toastr.css";
      document.head.append(styleSheet);
  }

var notificationContainer = new Element.html('<div></div>')
                          ..id='notification-container';
var notificationBody = new Element.html('<div></div>')
                    ..classes.add('notification');
var notificationButton = new ButtonElement()
                    ..classes.add('notification-close-button')
                    ..text='x';

var notificationTitle = new Element.html('<div></div>')..classes.add('notification-title');
var notificationMsg = new Element.html('<div></div>')..classes.add('notification-message');
var notificationMsgLabel = new LabelElement();

Element launchElement(type,location,Title,Msg){
notificationButton.onClick.listen((e) => notificationContainer.nodes.remove(notificationBody));
notificationContainer..classes.add('notification-'+location);
notificationBody..classes.add('notification-'+type);
notificationTitle.text=Title;
notificationMsg.innerHtml='<label>'+Msg+'</label>';
       notificationBody.nodes..add(notificationButton)..add(notificationTitle)..add(notificationMsg);                        
notificationContainer.nodes..add(notificationBody);
return (notificationContainer);  
}

}

Element mynotification = querySelector('#notification-element');

void CreatefonixNotification(type,location,Title,Msg){
    var notifyMe = new Element.tag('x-notification');
    notifyMe = notifyMe.launchElement(type,location,Title,Msg);
    mynotification.nodes.add(notifyMe);
}

在 index.dart 中，我注册了元素：

document.registerElement(NotificationElement.tag, NotificationElement);

在 index.html 中，我添加了这个 div：

<div id='notification-element'></div>

应用程序中的任何地方，我都可以这样称呼它：

CreateNotification('error','top-left','Error:','sorry we have some issue!!.')

【讨论】：