Comments (4)
Hi Phillip,
You can put the content into an external html file, and fetch it into DOM by using ng-include
, and in ngPopup, using templateUrl
to insert the content,
here is a simple demo:
Demo
As you can see in that demo, although DOM and popup have same html contents, they actually in different scopes
from ngpopup.
Hi Mark,
Thank you for the example. I did spend this evening with it trying to get it to work. I am going to further read up on angular scopes before I spend more time on it. My ng-include works well, but the dialog content (while rendering the template) appears to be using a different scope from the ng-include, and I wanted both scopes to be the same.
I will report back later when I have it working.
Thanks again.
Phillip
<div ng-controller="chatPopup">
<ng-pop-up option="ngPopupOption"></ng-pop-up>
<div ng-include="'chat/admin-chat.html'"></div>
</div>
chat.controller('adminChatController',
function($rootScope,$scope,chatService) {
$scope.closeChat = function(room,session_id) {
room.closeChat(session_id);
}
$scope.sendMessage = function(room,session_id) {
console.log("submit message ");
if (! room.message_text) {
return;
}
room.send({
sid: session_id,
content: room.message_text
});
room.message_text = '';
};
}
);
chat.controller('chatPopup',
function($rootScope,$scope) {
$scope.ngPopupOption = {
template:' ',
templateUrl:"chat/admin-chat.html",
draggable: true,
width: 400,
height: 400,
position:{
top:200,
left:200
}
}
}
);
from ngpopup.
When using ng-include
, a new scope will always be created, so does ngPopup
.
For my understanding, that is the way Angular to decouple model logic. So I think sharing scope is not the best practice. In your case, you can put the shared data in $rootScope
or service, and refer the data in adminChatController
from ngpopup.
Close this issue since no further feedback
from ngpopup.
Related Issues (18)
- How do you trigger the popup with a scope variable/data? HOT 1
- Dragging has some issue HOT 4
- Open on button click HOT 1
- Resize and z-index
- Drags issues
- Dragging proposed fix
- General issues: drags, events etc
- template not found with templateUrl
- can't import 'ng-popup' HOT 1
- A Version for Angular 2
- Created a branch to fix dragging issues
- bower register missing HOT 2
- Package.json and bower.json version tags do not match release tag HOT 1
- popup keeps growing HOT 4
- Can we use this directive ngPopup to open multiple dialog with one directive only HOT 2
- Dragging window on ngPopup demo causes it to shrink HOT 4
- Passing values to ngPopup template HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from ngpopup.