javascript 如何在 Joomla 中集成 AngularJs 应用程序

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/23365907/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-28 00:46:05  来源:igfitidea点击:

How to integrate AngularJs App inside Joomla

javascriptphpangularjsjoomlajoomla-extensions

提问by Neel

I am new to both Angular as well as Joomla that I am learning atm. What I am wondering is - is it possible to integrate Angular JS Application inside Joomla?From what I was reading about Joomla, I understand that this cms makes it easy to create Articles and manage contents and menus from Admin panel. However, since Angular JS app is an application by itself, an article page wont work ofcourse. So how do people go about integrating this?

我是 Angular 和 Joomla 的新手,我正在学习 atm。我想知道的是 -是否可以在 Joomla 中集成 Angular JS 应用程序?从我对 Joomla 的阅读来看,我了解到这个 cms 可以轻松地从管理面板创建文章和管理内容和菜单。但是,由于 Angular JS 应用程序本身就是一个应用程序,因此文章页面当然是行不通的。那么人们如何进行整合呢?

About Angular App:

关于 Angular 应用:

My Angular App is a bit similar to the Dan Wahlin's Customer Manager Appwhich has a separate MySQL DB for this app and using php for server side processing on Apache.

我的 Angular 应用程序有点类似于Dan Wahlin 的客户经理应用程序,它有一个单独的 MySQL 数据库用于这个应用程序,并使用 php 在 Apache 上进行服务器端处理。

Reason for trying to integrate Angular JS with Joomla:

尝试将 Angular JS 与 Joomla 集成的原因:

The main being, Joomla provides the user registration features, permission management for users, etc.. out of the box and I am planning to install the Membership extension to it. I only want the paid members to have access to the Angular App. That is what I am trying to achieve.

主要是,Joomla 提供了用户注册功能、用户权限管理等。开箱即用,我计划为它安装 Membership 扩展。我只希望付费会员可以访问 Angular 应用程序。这就是我正在努力实现的目标。

What I have researched so far:

到目前为止我研究过的:

1) I looked into directPHPextension to see if the Angular JS app can be inserted using this ext. But I dont think that will work nor is it the right way to do it.

1)我查看了directPHP扩展程序,看看是否可以使用此扩展程序插入 Angular JS 应用程序。但我认为这行不通,也不是正确的做法。

2) On searching more, I came across this Joomla Tutorial and I am not sure if that is the way to go with it. "Developing a MVC Component": http://docs.joomla.org/Developing_a_Model-View-Controller_%28MVC%29_Component_for_Joomla!2.5

2)在搜索更多时,我遇到了这个 Joomla 教程,我不确定这是否适合它。“开发 MVC 组件”:http: //docs.joomla.org/Developing_a_Model-View-Controller_%28MVC%29_Component_for_Joomla!2.5

If anyone can guide me on these will help me tremendously:

如果有人可以指导我这些将极大地帮助我:

1) An overview on how the Angular App can be integrated with Joomla, what needs to be done, the requirements, etc... I understand that explaining this will be beyond the scope of SO, but some pointers here will help.

1) 关于如何将 Angular App 与 Joomla 集成的概述,需要做什么,要求等......我知道解释这将超出 SO 的范围,但这里的一些指示会有所帮助。

2) Show / guide me the way on where I need to start reading in order to achieve this. I tried googling on this topic and I cant find any tutorial that shows how to integrate Angular and Joomla.

2)向我展示/指导我需要从哪里开始阅读以实现这一目标。我尝试使用谷歌搜索这个主题,但找不到任何展示如何集成 Angular 和 Joomla 的教程。

回答by Neel

I was finally able to integrate AngularJS app with Joomla. It was actually a lot easier than I thought it would be. My Angular App is a standalone app and I am only using Joomla for user registrations, for paid membership program, sending newsletters etc.. Therefore I want Joomla to give access to my Angular App only if they have the right user permissions. To integrate these 2, I did the following:

我终于能够将 AngularJS 应用程序与 Joomla 集成。这实际上比我想象的要容易得多。我的 Angular 应用程序是一个独立的应用程序,我只使用 Joomla 进行用户注册、付费会员计划、发送时事通讯等。因此,我希望 Joomla 只有在拥有正确的用户权限时才能访问我的 Angular 应用程序。为了整合这两个,我做了以下事情:

1) I read the docs on Developing a MVC Componentfor Joomla and tried to understand how the MVC component works: http://docs.joomla.org/J3.3:Developing_a_MVC_Component

1)我阅读了有关为 Joomla开发 MVC 组件的文档,并试图了解 MVC 组件的工作原理:http: //docs.joomla.org/J3.3: Developing_a_MVC_Component

2) I then created a component for this Angular App. Creating this component was really easy since I used the tools here: http://www.component-creator.com/

2) 然后我为这个 Angular App 创建了一个组件。创建这个组件真的很容易,因为我在这里使用了工具:http: //www.component-creator.com/

3) I then uploaded the component to Joomla and installed it from back-end.

3) 然后我将组件上传到 Joomla 并从后端安装它。

4) I added the component link to the menu and set the permissions there so only the registered users can access the app's menu link.

4)我将组件链接添加到菜单并在那里设置权限,以便只有注册用户才能访问应用程序的菜单链接。

Thats it! It worked after that. I was surprised how simple it was to incorporate the Angular app as a component into existing Joomla installation. The only things I need to do in my Angular app are:

而已!在那之后它起作用了。我很惊讶将 Angular 应用程序作为组件合并到现有的 Joomla 安装中是多么简单。我需要在我的 Angular 应用程序中做的唯一事情是:

1) Edit the relative path in the app so the path is from joomla's index.php file instead of Angular app's index file.

1) 编辑应用程序中的相对路径,使路径来自 joomla 的 index.php 文件,而不是 Angular 应用程序的索引文件。

2) Fix the class conflicts that may arise due to any conflicts between Bootstrap and Joomla template.

2) 修复 Bootstrap 和 Joomla 模板之间的任何冲突可能导致的类冲突。

This is my first attempt since I am very new to Joomla. I hope this helps out others who might be wondering the same since I was so lost on how to do it when I got started. The Joomla docs are pretty good that helped me with this a lot.

这是我的第一次尝试,因为我对 Joomla 很陌生。我希望这能帮助其他可能有同样疑问的人,因为我一开始就迷失了如何去做。Joomla 文档非常好,这对我帮助很大。

Happy Coding!

快乐编码!