angular-ui-bootstrap

How do I increase modal width in Angular UI Bootstrap?

by

I use a css class like so to target the modal-dialog class: .app-modal-window .modal-dialog { width: 500px; } Then in the controller calling the modal window, set the windowClass: $scope.modalButtonClick = function () { var modalInstance = $modal.open({ templateUrl: ‘App/Views/modalView.html’, controller: ‘modalController’, windowClass: ‘app-modal-window’ }); modalInstance.result.then( //close function (result) { var a = result; }, … Read more

Angular JS – Automatically focus input and show typeahead dropdown – ui.bootstrap.typeahead

by

Updated: I added the directive to github for easy updates and access. You can now install it as a dependency through bower. Original post: I came up with a pretty clean hack that does not require any changes to ui-bootstrap-tpls. The Idea is to use $setViewValue() to trigger the popup with a combination of a … Read more

Hide Angular UI Bootstrap popover when clicking outside of it

by

UPDATE: With the 1.0 release, we’ve added a new trigger called outsideClick that will automatically close the popover or tooltip when the user clicks outside the popover or tooltip. Starting with the 0.14.0 release, we’ve added the ability to programmatically control when your tooltip/popover is open or closed via the tooltip-is-open or popover-is-open attributes.

Invoking modal window in AngularJS Bootstrap UI using JavaScript

by

OK, so first of all the http://angular-ui.github.io/bootstrap/ has a <modal> directive and the $dialog service and both of those can be used to open modal windows. The difference is that with the <modal> directive content of a modal is embedded in a hosting template (one that triggers modal window opening). The $dialog service is far … Read more

Angular-UI Router: Nested Views Not Working

by

I created working plunker here NOTE: You should read about state nesting and named views more. Because the current state and view definition is simply wrong. Nested States & Nested Views Multiple Named Views Firstly, we should not use the ONE state definition with many views: {}. But we should split them into real states. … Read more

angularjs share data config between controllers

by

Consider the method described by this post: Extending AngularJS Controllers Using the Mixin Pattern Instead of copying your methods out of a service, create a base controller that contains those methods, and then call extend on your derived controllers to mix them in. The example from the post: function AnimalController($scope, vocalization, color, runSpeed) { var … Read more

How to add bootstrap in angular 6 project? [duplicate]

by

For Angular Version 11+ Configuration The styles and scripts options in your angular.json configuration now allow to reference a package directly: before: “styles”: [“../node_modules/bootstrap/dist/css/bootstrap.css”] after: “styles”: [“bootstrap/dist/css/bootstrap.css”] “builder”: “@angular-devkit/build-angular:browser”, “options”: { “outputPath”: “dist/ng6”, “index”: “src/index.html”, “main”: “src/main.ts”, “polyfills”: “src/polyfills.ts”, “tsConfig”: “src/tsconfig.app.json”, “assets”: [ “src/favicon.ico”, “src/assets” ], “styles”: [ “src/styles.css”,”bootstrap/dist/css/bootstrap.min.css” ], “scripts”: [ “jquery/dist/jquery.min.js”, “bootstrap/dist/js/bootstrap.min.js” ] … Read more

Mocking $modal in AngularJS unit tests

by

When you spy on the $modal.open function in the beforeEach, spyOn($modal, ‘open’).andReturn(fakeModal); or spyOn($modal, ‘open’).and.returnValue(fakeModal); //For Jasmine 2.0+ you need to return a mock of what $modal.open normally returns, not a mock of $modal, which doesn’t include an open function as you laid out in your fakeModal mock. The fake modal must have a result … Read more

tech