首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >Peg.js在AngularJS应用程序中的应用

Peg.js在AngularJS应用程序中的应用
EN

Stack Overflow用户
提问于 2015-06-11 08:00:50
回答 1查看 565关注 0票数 0

我有一个AngularJS网络应用程序。

我想在我的应用程序中使用peg.js。我刚刚编写了一个peg.js语法: CriteriaValue.pegjs,并使用生成CriteriaValue.js的命令行:pegjs CriteriaValue.pegjs生成了解析器。

有人能给我解释一下如何使用解析器吗?

变量结果= parser.parse('my‘);不工作。

我创建了一个柱塞:http://plnkr.co/edit/Ae05SeZAjKOQ75B3lvLc?p=preview

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2015-06-12 00:00:27

简短回答

  • 在CriteriaValue.js中,将第一行的module.exports更改为parser
  • 在index.html中,交换<script>标记,以便CriteriaValue.js优先
  • (可选)在script.js中,将解析结果输出为格式化的JSON字符串,以查看实际值

下面是柱塞:http://plnkr.co/edit/kiBp2Na9s4PXpenCzQjx?p=preview

长答案

运行原始柱塞并检查控制台日志;您将注意到两个错误:

  • ReferenceError: Can't find variable: parser (script.js:3)
  • ReferenceError: Can't find variable: error (CriteriaValue.js:1)

第一个错误是由于没有parser对象在全局范围内由script.js或CriteriaValue.js创建。

查看CriteriaValue.js,您可以看到它实际上是将生成的解析器对象分配给一个不存在的modules.export。这是PEG.js的默认行为,因为它假定您将在node.js中使用解析器。您看到错误的原因是没有module对象,所以我们不能分配给这个不存在的对象的export属性。将赋值更改为parser,这是我们可以分配的(因为PEG.js不使用严格模式),避免了这个错误,并使parser可以在script.js中使用。

最后,需要在script.js使用解析器之前创建解析器;这就是<script>交换的原因。

对于CriteriaValue.js的未来创建,请如下所示:

代码语言:javascript
运行
AI代码解释
复制
pegjs --export-var parser CriteriaValue.pegjs

这将生成文件,以便将对象分配给变量parser而不是module.exports

AngularJS进来的地方

正如@dirkk在注释中所说的,将解析器定义为全局变量是错误的做法,当然不是AngularJS方法,即将解析器实现为服务。

最快(但不一定是最好的)方法是使用您已经生成的CriteriaValue.js代码并围绕它包装一个服务。例如:

代码语言:javascript
运行
AI代码解释
复制
angular.module('yourApp.services', [])
.factory('Parser', function() {
  // The generated code, except replace "parser = " with "return "
});

另一种选择是获取.pegjs文件&在客户机上使用PEG.buildParser()生成解析器。

代码语言:javascript
运行
AI代码解释
复制
angular.module('yourApp.services', [])
.factory('Parser', ['$http', '$q', function($http, $q) {
  var deferred = $q.defer();
  $http.get('path/to/CriteriaValue.pegjs')
  .success(function(grammar) {
    try {
      deferred.resolve(PEG.buildParser(grammar));
    } catch (e) {
      deferred.reject(e);
    }
  })
  .error(function(message) {
    deferred.reject('Unable to load grammar: ' + message);
  });

  return deferred.promise;
}]);

这使得更新语法变得更容易,因为您不必每次都重写服务,但这会增加加载应用程序的延迟。这是否可行取决于语法有多复杂&它实际需要改变的频率有多大。

尽管您如何构建解析器,也不一定需要将生成的解析器对象直接公开给其他的角度应用程序。相反,您可以为应用程序实际使用这个解析器(例如validate(input)getAST(input)等)实现更高级别的API。这样,如果您将来决定切换到另一个解析器(例如Jison),那么您需要更改的代码就少得多。

票数 4
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/30785839

复制
相关文章
如何在WordPress网站中添加Cookie弹出窗口(不使用插件)
如果你是使用WordPress建站的用户,那么有可能你的网站已经在使用Cookie来收集访问者的数据,如果您没有在网站上显示任何同意Cookie的通知,您可能会被处以巨额罚款或可能不得不处理严重的问题。
晓得博客
2021/07/23
4.5K0
[已解决]wordpress网站发布失败:此响应不是合法的JSON响应
前两天,用WordPress搭建这个博客(https://wpthemes.pythonthree.com),服务器是阿里云香港服务器,使用宝塔控制面板,但是,当进去Wordpress后台发表文章的时候,出现了如下报错: WordPress 发布失败。错误信息:此响应不是合法的JSON响应。
晓得博客
2021/01/05
12K1
弹出窗口大全
【1、最基本的弹出窗口代码】 其实代码非常简单:  window.open(page.htmJavaScript
Java架构师必看
2021/03/22
4.5K0
message 弹出窗口
import  javax.swing.JOptionPane; public class gong {     public static void main(String [] args) {  
Gxjun
2018/03/22
4.6K0
message 弹出窗口
Flex 弹出窗口的例子
<?xml version="1.0" encoding="utf-8"?> <mx:TitleWindow xmlns:mx="http://www.adobe.com/2006/mxml"   l
用户3135539
2018/09/12
3.5K0
jQuery的弹出窗口插件colorbox
支持 照片,照片组,幻灯片,ajax,内联 和 iframe 框架。 通过CSS 控制外观,使用用户可以很容易重新定制外观。 不需要更改 ColorBox 的 javascript 文件就可以重新设定其行为。 可以依靠 callback & event-hooks 进行拓展,不需要修改源代码。 非常友好,不需要修改现有的 HTML,所有的选项都通过 JS 设置。
全栈程序员站长
2021/12/23
5.8K0
WordPress给网站添加鼠标点击爱心弹出效果
一、部署JS代码(将以下代码保存为js文件,文件名:love.js,然后直接引入使用,点击页面任意位置就可以看到效果了)
子润先生
2021/07/07
9140
ASP.NET弹出窗口技术之增加网站流量方法
作为Microsoft的最新建立动态Web网站的工具,ASP.NET相对于ASP和JSP在改变原始的Web编程方式方面有了长足的长进。它的代码与页面分离技术(CodeBehind)以及完善的Web服务器控件为程序员提供了一个更加符合传统编程的Web服务器端开发方式。但Web编程还是有着与传统编程不相同的特点,这些特点决定了ASP.NET编程中必须以一些特殊的技巧来完成程序要求,弹出窗口正是这类编程方式的代表。相当多的编程书籍对弹出窗口采取缄默或者一语带过,似乎看不过弹出窗口的巨大使用天地。本文将为你解开弹出窗口使用中的大多数问题。
Java架构师必看
2021/03/22
1.2K0
jquery 模态窗口 弹出窗 simpleModal
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>SimpleModal Basic Modal Dialog </title> <link type='text/css' href='css/demo.css' rel='stylesheet' /> <link type='text/css' href='css/box.css' rel='stylesheet' /> </head> <body> <div id='container'>
用户5760343
2019/10/10
6.6K0
jquery 模态窗口 弹出窗 simpleModal
WordPress 网站如何有选择性的在新窗口打开链接?
WordPress 网站如何有选择性的在新窗口打开链接?在新窗口打开链接有时还是很有必要,下面这个简单实例,是利用 JQuery实现有选择性的在新窗口打开链接的方法。
主机教程网2bcd.com
2022/10/17
1.1K0
Silverlight Telerik控件学习:弹出窗口RadWindow
几乎所有的业务系统都有弹出窗口,典型场景有二种 : 1、简单的弹出一个对话框显示信息,比如下面这样: 这个很简单,代码示例如下: DialogParameters pars = new DialogP
菩提树下的杨过
2018/01/23
3.8K0
Silverlight Telerik控件学习:弹出窗口RadWindow
WPF 解决弹出模态窗口关闭后,主窗口不在最前
本文告诉大家如何解决这个问题,在 WPF 的软件,弹出一个模态窗口。使用另一个窗口在模态窗口前面。从任务栏打开模态窗口。关闭模态窗口。这时发现,主窗口会在刚才使用的另一个窗口下面。
林德熙
2018/09/18
15.2K2
js实现网页弹出窗口的代码详细教程
经常上网的朋友可能会到过这样一些网站,一进入首页立刻会弹出一个窗口,或者按一个连接或按钮弹出,通常在这个窗口里会显示一些注意事项、版权信息、警告、欢迎光顾之类的话或者作者想要特别提示的信息。其实制作这样的页面效果非常的容易,只要往该页面的html里加入几段javascript代码即可实现。下面俺就带您剖析它的奥秘。 【1、最基本的弹出窗口代码】 其实代码非常简单: <script language="javascript"> window.open ('xx.html') </scri
Youngxj
2018/06/06
27.8K0
让Safari不再弹出新窗口
一直很喜欢Firefox点击页面中带有target=“_blank”链接的时候,不是新开窗口,而是打开一个新的标签。
EltonZheng
2021/01/26
3.7K0
WPF 解决弹出模态窗口关闭后,主窗口不在最前
本文告诉大家如何解决这个问题,在 WPF 的软件,弹出一个模态窗口。使用另一个窗口在模态窗口前面。从任务栏打开模态窗口。关闭模态窗口。这时发现,主窗口会在刚才使用的另一个窗口下面。
林德熙
2019/03/13
5.6K0
WPF 已知问题 全屏透明窗口弹出子窗口会闪烁
在 WPF 中通过设置 WindowStyle 为 None 以及 WindowState 为 Maximized 进入全屏,同时设置 AllowsTransparency 支持透明,此时弹出一个设置 WindowStyle 是 None 的子窗口,用 VisualStudio 2019 运行将会看到 子窗口 先显示出来,然后回到主窗口下面,然后再显示到主窗口上面
林德熙
2020/03/23
4.3K0
显示为弹出窗口是什么意思(电脑总是弹出广告)
快快赶紧的把我的指甲刀那来,谁都不要拦我~~~~~~~~~~~~~~~~~~~~~~~~
全栈程序员站长
2022/08/01
3.9K0
显示为弹出窗口是什么意思(电脑总是弹出广告)
WPF 解决弹出模态窗口关闭后,主窗口不在最前
本文告诉大家如何解决这个问题,在 WPF 的软件,弹出一个模态窗口。使用另一个窗口在模态窗口前面。从任务栏打开模态窗口。关闭模态窗口。这时发现,主窗口会在刚才使用的另一个窗口下面。
林德熙
2022/08/04
6.1K0
ViewWizard 查看弹出窗口来源的小工具
在你的电脑被安装上了各种国产软件全家桶之后,各种各样的广告弹窗也就随之而来了。与网页广告不同的是,这些桌面弹窗有时无法判定来源软件,让人十分头疼。比如下面这个来自网友的例子:
reizhi
2022/09/26
5.9K0
ViewWizard 查看弹出窗口来源的小工具
点击加载更多

相似问题

模式弹出窗口没有响应。网站具有响应性,弹出窗口中的内容也具有响应性

10

响应弹出窗口

68

响应弹出窗口CSS

10

网站条目确认弹出窗口

10

“每月特价”的网站弹出窗口

10
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档