app.directive('myDirective',function() {
return {
restrict : 'A',
templateUrl : 'app/html.html'
};
});
I'm running into a problem with template html getting cached in the internet explorer. Every time the html is changed, either one of these need to be done to load the new templete:
Delete browsing history and clear temporary internet files.
Change browser setting 'Check for newer versions of stored pages' from Automatic to 'Every time I visit'
A similar problem is stated Here. The marked answer works, but was thinking if there is any better solution to the problem rather than defeating the browser caching.
You must use app version and increase after each update:
<html data-ver="1.0">
And in your js code:
// for example: read app version from data-ver attribute on html tag
window.appVersion = angular.element(document.getElementsByTagName('html')).attr('data-ver');
app.directive('myDirective',function() {
return {
restrict : 'A',
templateUrl : 'app/html.html?v=' + window.appVersion
};
});
I had this issue with changes that I made to my templates. I was able get rid of the single template file that I needed to by following these steps:
Open Internet Explorer
Click the Tools (Alt-X) button and then click Internet Options
Click the General tab, and then under Browsing history, slick Settings
In the Temporary Internet Files and History Settings dialog box, click View Files
Locate the template file that you have modified and delete it.
I hope this helps.
Related
How can I automatically close the $cordovaInAppBrowser when it goes to my website and returns content "OK"? I would like to do this to avoid displaying the close button in the browser window.
Does anyone know how I can achieve this?
I did find the website that can solve this for those who also need to self close the browser in some condition.Here is the reference link : https://developer.salesforce.com/forums/?id=906F00000009ALSIA2
sample coding:
authWindow.addEventListener('loadstop', function(e) {
var loc = e.url;
//when url is changed check if the url contains your specific callbackURL
if (loc.search(data.callbackURL) >= 0) {
//at this point close your inapp browser
//you will land on the index page within your application.
authWindow.close();
//your code after successful authentication
}
});
you can use something like a timeout function or other than that a even listener other than i would suggest make a custom plugin and use it. The solution provided by #Blouraf is very hacky.
I did find some documentation on the cordova plugin that recommends a listener.
Drupal 7 with TinyMCE included via the Wysiwyg module. "Paste" is enabled in the Wysiwyg config screen. The editor is in general working fine, but now I'm attempting to modify TinyMCE's paste feature to strip all attributes from HTML tags. (Client requirement, don't ask.)
Have added the following to the module file:
function MYMODULE_wysiwyg_editor_settings_alter(&$settings, $context) {
if ($context['profile']->editor == 'tinymce') {
drupal_add_js(drupal_get_path('module', 'MYMODULE').'/js/tinymce_callbacks.js');
$settings['paste_preprocess'] = 'MYMODULE_tinymce_paste_preprocess_callback';
}
}
and have created tinymce_callbacks.js with the following contents:
function MYMODULE_tinymce_paste_preprocess_callback(pl, o) {
alert(o.content);
o.content = "-: CLEANED :-\n" + o.content;
}
The actual TinyMCE paste button only works with IE, but the ctrl-V shortcut works with every browser. However, the callback is not called.
I did some digging around. The paste_preprocess setting is definitely being added to the correct JavaScript object, but the only code that references it -- the TinyMCE Paste plugin -- isn't being loaded. So it looks like the problem is with Drupal, not TinyMCE.
Any help getting Drupal to load TinyMCE plugins correctly would be most appreciated.
Make sure that the "paste" TinyMCE plugin is actually being loaded. For some reason, in Drupal there is an entry under "Buttons and Plugins" titled simply "Paste". This however does NOT enable the "paste" plugin required for the paste preprocess callback to occur.
Instead, make sure either "Paste Text" or "Paste from Word" is enabled. This should cause the "paste" plugin to load, and the paste preprocess callback to occur.
I have created a sidemenu based app, in that after login I am displaying a number of tasks. If I click on the task it will redirect to the task details page, in that page I can update the tasks.
So after updating a task I need to go back to the previous task list page. I am using $ionicHistory.goBack(); to go back.
My problem is after come back, I need to refresh the task list i.e. updated task should not be there in the task list. How can I refresh/reload the task list?
If you bind your task to a tasks array, which will be used in the task list page, it should be automatically updated.
But the question is about not displaying, newly added tasks (still my previous suggestion should work) if not, performance reasons ionic views are cached, So when you come back to the previous view it doesn't go through the normal loading cycle. But you 2 options
1 - disable the caching by using <ion-view cache-view="false" view-title="My Title!"> in your ion-view, but this is not a very elegant solution. read more
2 - use ionRefresher (my preferred). read more here
https://github.com/angular-ui/ui-router/issues/582
according to #hpawe01 "If you are using the current ionicframework (ionic: v1.0.0-beta.14, angularjs: v1.3.6, angular-ui-router: v0.2.13), the problem with the not-reloading-controller could be caused by the new caching-system of ionic:
Note that because we are caching these views, we aren’t destroying scopes. Instead, scopes are being disconnected from the watch cycle. Because scopes are not being destroyed and recreated,controllers are not loading again on a subsequent viewing.
There are several ways to disable caching. To disable it only for a single state, just add cache: false to the state definition.
This fixed the problem for me (after hours of reading, trying, frustration).
For all others not using ionicframework and still facing this problem: good luck!"
Hope this helps.
You can also listen to ionic events such as $ionicView.enter on $scope and trigger the code that refreshes the list if you haven't bound your list as #sameera207 suggested.
EG:
// List.controller.js
angular.module('app')
.controller('ListController', ['$scope', function($scope) {
// See http://ionicframework.com/docs/api/directive/ionView/ for full events list
$scope.$on('$ionicView.enter', function() {
_someCodeThatFetchesTasks()
.then(function(tasks) {
$scope.tasks = tasks;
});
});
});
Bear in mind that it's not the most proper way (if proper at all) and if you do this you certainly have a design flaw. Instead you should share the same data array via a factory or a service for example.
For your task you can also use ion-nav-view.
It is well documented. And if you are using now Ionic 2 beta you can use some of the view lifecyle hooks like onPageWillLeave() or onPageWillEnter(). I just faced the same problem and defined a refresh() function, but the user had to click on a button to actually update the view. But then I found:
https://webcake.co/page-lifecycle-hooks-in-ionic-2/
You just have to import the Page and NavController module and also define it in the constructor. The you can use for example onPageWillEnter(), which will always invoke when you go again to a view:
onPageWillEnter() {
// Do whatever you want here the following code is just to show you an example. I needed it to refresh the sqlite database
this.storage.query("SELECT * FROM archivedInserates").then((data) = > {
this.archivedInserates =[];
if (data.res.rows.length > 0) {
for (var i = 0; i < data.res.rows.length; i++) {
this.archivedInserates.push({userName:data.res.rows.item(i).userName, email:
data.res.rows.item(i).email});
}
}
},(error) =>{
console.log("ERROR -> " + JSON.stringify(error.err));
});
}
With ionic beta 8 the lifecylcle events changed their names. Check out the official ionic blog for the full list of the lifecycle events.
if you are building data driven app then make sure use $ionicConfigProvider.views.maxCache(0);in your app.config so that each review can refresh for more details read this http://ionicframework.com/docs/api/provider/$ionicConfigProvider/
cutting right to the chase here heh
Building an admin backend system with angular for a client. This site and backend are built with Node and Angular. I've got a post editor setup, so that when you click a link to edit a post, locationProvider and ngRoute go to work and swap out the partial with a new controller, and updates the url.
Here at this point, everything shows up perfectly.
It's when I click on Cancel (which is a standard link going back to the post list view) or submit (which works it's magic and then redirects to the same url as cancel) and this works.
It's when I click on the link to edit the same post again. The content that's supposed to be in the CKEditor is blank. However when using Chrome Dev Tools I can see that tw original input field has the content in it correctly, but the iframe has nothing in it at all but the CKEditor Chrome.
As for code,
In my controller it looks like this:
$scope.post = null;
$http.get('/api/post/'+$routeParams.id)
.success(function(data,status,headers){
$scope.post = data;
});
$(function() {
CKEDITOR.replace("content");
});
$scope.submit = function() {
// submission code here
};
Pretty basic here, just want to get the basics out of the way first.
Is the problem with how I'm loading CKEditor?
CKEDITOR.replace("content") would replace the html element with CKEditor instance. Assuming "content" is some div id or text area in your html.
To set the content you need to use
CKEDITOR.instances["content"].setData("Contents to be displayed in text area");
Before I go and do this in Jquery out of frustration I figured I would ask what the angular way is?
I'm building an AngularJS site using a model based of the Phonecat tutorial example on the AngularJS site.
I found this method to set the title of a page and can work out how to modify it to do description as well in the app config but this doesn't work when I'm populating pages with content via json. I tried doing it using a ngbind method as well but have yet to find a working solution as I think something to do with the order in which files are loaded is breaking.
For example
when('/faq', {
templateUrl: 'sub_pages/articles.html',
title: 'Landing page title goes here, not to big a deal'
}).
when('/things-to-do/:activityID', {
templateUrl: 'sub_pages/activity-detail.html',
controller: 'activityDetailCtrl',
title: 'If I put a title here it will be the same on all of these pieces of content'
}).
What method can I use in order to set title on both the landing pages and also the pages which draw their content from a JSON feed?
EDIT - ANSWER BELOW
After about 2 days of bashing my head against a wall trying to work this one out it's actually quite simple and works for both static pages and templates with dynamically loaded content.
Inside the view pages (html that loads inside of ng-view) add a couple of divs (you can put this anywhere really) and then inside them you need to load in ng-init.
ng-init="$root.title = path.to.title"
ng-init="$root.description = path.to.description"
This will set the title and description on the root scope. The "path.to." is just an example path to content in json, you can replace this with plain text as well which is how I deal with landing pages.
Then on the index.html or what ever page your app is based on inside the head you just need to load in.
Your Page Title
This will automatically set your page title and description meta tags and you can pretty much use this formula for any other meta data you need to create.
I haven't tested this yet with Prerender.io or any other cache service but will do some checks and post the results here.
Something like
$document[0].title = "xyz";