Loading Google charts and angular using require not working - google-visualization

I am trying to load google visualization (charts) using Require.js along with angular js and Jquery
I refered to many posts and from here I saw we could use the https://github.com/millermedeiros/requirejs-plugins/blob/master/src/goog.js plugin
Here is my code. But this is not working, it is not loading any subsequent scripts.
require.config({
paths: {
async: 'lib/async',
goog: 'lib/goog',
propertyParser : 'lib/propertyParser',
jquery: 'lib/jquery.min',
'jquery.ui.widget': 'lib/jquery.ui.widget',
jqfileupload: 'lib/jquery.fileupload',
jqfileuploadiframe: 'lib/jquery.iframe-transport',
angular:'lib/angular.min',
ngUi:'lib/angular-ui.min',
ngResource:'lib/angular-resource.min',
ngCookies:'lib/angular-cookies.min',
bootstrap:'lib/bootstrap.min'
},
shim: {
'angular' : {exports:'angular',deps:['jquery']},
'ngResource' : {exports:'ngResource',deps:['angular']},
'ngUi' : {exports:'ngUi',deps:['angular']},
'ngCookies' : {exports:'ngCookies',deps:['angular']},
'jquery.ui.widget' : ['jquery'],
'jqfileupload' : ['jquery','jqfileuploadiframe','jquery.ui.widget'],
'bootstrap' : ['jquery'],
}
});
define(['angular','jquery','ngResource','ngCookies','ngUi','bootstrap','jqfileupload','goog!visualization,1,packages:[corechart]'],function(){
var app = angular.module("myApp",[]);
});
It gives me the error
Error: No module: myApp
If I remove the 'goog!visualization,1,packages:[corechart]' entry, it all works fine
Please help and thanks in advance

Related

Ember-models-table addon throws ember warn error while trying to use 'routeName' property

Am using ember-models-table to display table in my applicaiton. The table is great for sorting , pagination etc, but am trying to route from specific row to different page based on the id. it has mentioned in its example to use 'routeName'
But when I use it throws the following error:
"Assertion Failed: When calling warn you must provide an options hash as the third parameter. options should include an id property."
My .js coding :
columns:[
{
"propertyName": "firstName",
"title":"First Name",
"routeName":"/#/profile/_id"
},
and so on
Thanks for your help.
update: the error is gone after updating ember to ember 3.1.2
but there is a warning and its not functioning properly as expected , where am i going wrong?
my code :
columns:[
{
"propertyName": "firstName",
"title":"First Name",
"routeName":"profile"
},
If you look at the example app for this addon, you'll see the following syntax for the route:
{
propertyName: 'id',
routeName: 'users.user'
},
This roughly corresponds to a route like users/1. So, if this is your router:
Router.map(function() {
this.route('users', function() {
this.route('user', { path: '/users/:user_id' });
});
});
And here are the columns:
columns: [
{
"propertyName": "something",
"routeName": "users.user"
},
{
"propertyName": "id",
"routeName": "users.user"
}
]
Here's the template:
{{models-table
data=model
columns=columns
...
}}
routeName should not include the id segment.
Hover over the anchor tag created to see where it leads to, and make adjustments until it matches where it should go. It will only render when there's a valid route for the link. The path seems like it might be relative, so if you're already on the users route, you may only need to specify user for the routeName.
I figured this out by searching the addon codebase for routeName and then trying it out with the same kind of format that {{link-to}} helper uses in Ember.
P.S. this is some missing info in the documentation, so if this addon is helping you out, consider making a PR to help others.

Ember Js and Sails js AND clause in controller

I'm working on a project with Ember.js and Sails.js now i'm having an issue
in my controller,
i want to run a computed query and use "AND" clause but i don't know how to
do it, i tried to google it but had no luck
here is my controller
selectedDepartment: Ember.computed(function (){
return this.get('store').query('service', {
where : {
department : this.get('department.id'),
isPublic : true
}
})
})
It's getting me crazy i mean what is wrong here ?

AngularJS and Ionic Framework: module is not available error

When loading my webpage, I get the following errors:
Error: [ng:areq] Argument 'LFSTD' is not a function, got undefined
Uncaught ReferenceError: controller is not defined
The webpage i'm loading has the ng-app attribute in the body tag, and a Ionic tag has the ng-controller:
<body ng-app="ia">
[...]
<ion-side-menu-content ng-controller="LFSTD">
"ia" and "LFSTD" are both defined in app.js. The webpage does load the following static files correctly
This is app.js:
angular.module('ia', ['ionic'])
.run(function ($ionicPlatform) {
$ionicPlatform.ready(function () {
controller('LFSTD', function($scope, $ionicSideMenuDelegate) {
$scope.toggleLeft = function() {
$ionicSideMenuDelegate.toggleLeft();
};
});
});
})
I've been struggling with this, lurking stackoverflow and ionic/angular docs for quite a while. It might be worth saying that my project uses Django. Any idea what might be causing these errors?
Solution
angular
.module('ia', ['ionic'])
.config(function ($routeProvider) {
$routeProvider
.when('/', {
templateUrl: 'create.html',
controller: 'LFSTD'
})
}
.run(function ($ionicPlatform) {
$ionicPlatform.ready(function () {
controller('LFSTD', function($scope, $ionicSideMenuDelegate) {
$scope.toggleLeft = function() {
$ionicSideMenuDelegate.toggleLeft();
};
});
});
})
I was missing the .controller part in app.js. I thought I could include controllers in a function, but no. It needs to be directly after the angular.module. See updated question.

How do I properly setup app-test.js when unit testing ExtJS using Jasmine?

I am fairly new to both Jasmine(2.2) as well as ExtJS(4.2.1). I am following the Unit Testing instructions in the Sencha docs to test the feed-viewer example ExtJS application. I cannot seem to get the app-test file quite right to load the application.
Here is my app-test.js
Ext.Loader.setConfig({ enabled : true });
var Application = null;
Ext.onReady( function() {
Application = Ext.create('app', {
name: 'FV',
controllers: [
'Articles'
],
launch: function() {
var jasmineEnv = jasmine.getEnv();
jasmineEnv.updateInterval = 1000;
jasmineEnv.execute();
}
});
});
Here is the app.js
Ext.application({
name: 'FV',
paths: {
'Ext.ux': '../../../examples/ux/'
},
controllers: [
'Articles',
'Feeds'
],
autocreateViewport: true
});
And, in case this may be a part of the issue, my folders are structured as such:
FV/
- app/
- app-test/
- resources/
- specs/
- app.js
- app-test.js
- run-test.html
My test to see that the application has been properly loaded is failing. Chrome's dev tools show me two errors. The first is an XMLHttpRequest cannot load, and the second is an Uncaught TypeError: Object is not a function being thrown at the third line of app-test.js
I feel like there's something remarkably simple I may have missed.
Any help would be immensely appreciated!
I finally got it working. Here is my revised app-test.js
Ext.Loader.setConfig({ enabled : true });
Ext.ns('FV');
Ext.application({
name: 'FV',
appFolder: 'app',
controllers: ['Articles'],
autoCreateViewport: false,
launch: function() {
var jasmineEnv = jasmine.getEnv();
jasmineEnv.updateInterval = 1000;
jasmineEnv.execute();
}
});
Considering how different this is from the tutorial in the Sencha docs, and how much Jasmine has changed since 1.1.0 (which is the version their tutorial uses), it's definitely time for them to do an update.

How to query JSON file in emberjs

I´ve never work with JSON before, but have with xml, php, mysql. I have a populated database on the server and would like to develop a web application with ember.js to interact with this data (CRUD).
Where should I start? I know ember-data has most of the things I would need when developing, but I'm unsure of how to start.
Since the database holds different tables, is it possible to keep this information in one json file? is it the appropriate way to do it? How do I automatically produce this json file from the server?
you can start with a read query :
You upload a file sample with the json syntaxe on your server (or use your json service if it's enable) to start quickly. Test that you can access to it in your browser, for example :
[ {"id": 1, "desc": "hmarchadour"}, {"id": 2, "desc": "moderator"} ]
Well now you take/create a view in your embjer js and you can use JQuery to call this file/service :
Ember.View.create({
templateName : "templateName" // you
stuff : [],
didInsertElement : function() {
$.ajax({
type : "GET",
url : <url-of-your-sample>,
dataType: "json",
success : function(result) {
var tmpStuff = json2Stuff(result);
this.set('stuff', tmpStuff);
},
error : ... }
);
}
});
Regards,