একটি কৌণিক প্রকল্পে বুটস্ট্র্যাপ কীভাবে ব্যবহার করবেন?


170

আমি আমার প্রথম কৌণিক অ্যাপ্লিকেশন শুরু করছি এবং আমার বেসিক সেটআপটি সম্পন্ন হয়েছে।

আমি কীভাবে আমার অ্যাপ্লিকেশনটিতে বুটস্ট্র্যাপ যুক্ত করতে পারি?

আপনি যদি একটি উদাহরণ সরবরাহ করতে পারেন তবে এটি একটি দুর্দান্ত সহায়তা হবে।

উত্তর:


119

আপনি নতুন প্রকল্প উত্পন্ন করতে কৌণিক-সিএলআই ব্যবহার করে , কৌণিক 2/4 এ বুটস্ট্র্যাপ অ্যাক্সেসযোগ্য করার আরও একটি উপায় আছে ।

  1. কমান্ড লাইন ইন্টারফেসের মাধ্যমে প্রকল্প ফোল্ডারে নেভিগেট করুন। তারপর ব্যবহার npm বুটস্ট্র্যাপ ইনস্টল করতে:
    $ npm install --save bootstrap--saveবিকল্প নির্ভরতা মধ্যে প্রদর্শিত বুটস্ট্র্যাপ করতে হবে।
  2. .Angular-cli.json ফাইলটি সম্পাদনা করুন যা আপনার প্রকল্পটি কনফিগার করে। এটি প্রকল্প ডিরেক্টরি ভিতরে। "styles"অ্যারেতে একটি রেফারেন্স যুক্ত করুন । রেফারেন্সটি এনপিএম সহ ডাউনলোড করা বুটস্ট্র্যাপ ফাইলের আপেক্ষিক পথ হতে হবে। আমার ক্ষেত্রে এটি:"../node_modules/bootstrap/dist/css/bootstrap.min.css",

আমার উদাহরণ .angular-cli.json:

{
  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
  "project": {
    "name": "bootstrap-test"
  },
  "apps": [
    {
      "root": "src",
      "outDir": "dist",
      "assets": [
        "assets",
        "favicon.ico"
      ],
      "index": "index.html",
      "main": "main.ts",
      "polyfills": "polyfills.ts",
      "test": "test.ts",
      "tsconfig": "tsconfig.app.json",
      "testTsconfig": "tsconfig.spec.json",
      "prefix": "app",
      "styles": [
        "../node_modules/bootstrap/dist/css/bootstrap.min.css",
        "styles.css"
      ],
      "scripts": [],
      "environmentSource": "environments/environment.ts",
      "environments": {
        "dev": "environments/environment.ts",
        "prod": "environments/environment.prod.ts"
      }
    }
  ],
  "e2e": {
    "protractor": {
      "config": "./protractor.conf.js"
    }
  },
  "lint": [
    {
      "project": "src/tsconfig.app.json"
    },
    {
      "project": "src/tsconfig.spec.json"
    },
    {
      "project": "e2e/tsconfig.e2e.json"
    }
  ],
  "test": {
    "karma": {
      "config": "./karma.conf.js"
    }
  },
  "defaults": {
    "styleExt": "css",
    "component": {}
  }
}

এখন বুটস্ট্র্যাপ আপনার ডিফল্ট সেটিংসের অংশ হওয়া উচিত।


1
আমি মনে করি বুটস্ট্র্যাপ.মিন.জেসগুলি এই দ্রষ্টব্যটিতে "স্ক্রিপ্টগুলি" এ যুক্ত করা উচিত। তুমি কি একমত?
হামালাইভ

1
@ হামলাইভ এটি অন্তত বাধ্যতামূলক নয়।
LaPriWa

3
আমি পদক্ষেপ 1 ব্যবহার করে এবং পরে @Import "../node_modules/bootstrap/dist/css/bootstrap.min.css" প্রবেশ করে বুটস্ট্র্যাপ ইনস্টল করেছিলাম; নিম্নলিখিত পোস্ট স্ট্যাকওভারফ্লো . com /a/40054193/3777549 তে বর্ণিত হিসাবে আমার এসআরসি / স্টাইলস.কম ফাইলটিতে । এই পোস্টে দ্বিতীয়
পদক্ষেপটি

77

এনগুলার 2 এর সাথে একটি সংহতকরণ এনজি 2-বুটস্ট্র্যাপ প্রকল্পের মাধ্যমেও পাওয়া যায় : https://github.com/valor-software/ng2-bootstrap

এটি ইনস্টল করতে কেবল এই ফাইলগুলিকে আপনার মূল এইচটিএমএল পৃষ্ঠাতে রেখে দিন:

<script src="https://cdnjs.cloudflare.com/ajax/libs/ng2-bootstrap/x.x.x/ng2-bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet">

তারপরে আপনি এটিকে আপনার উপাদানগুলিতে এভাবে ব্যবহার করতে পারেন:

import {Component} from 'angular2/core';
import {Alert} from 'ng2-bootstrap/ng2-bootstrap';

@Component({
  selector: 'my-app',
  directives: [Alert],
  template: `<alert type="info">ng2-bootstrap hello world!</alert>`
})
export class AppComponent {
}

1
যদি আপনি এনজি 2-বুটস্ট্র্যাপ সংস্করণটি ব্যবহার করেন তবে আপনি কি বান্ডিল সিএসএস ব্যবহার করবেন না? আমি নিশ্চিত না আপনি কেন সিডিএন সিএসএস ব্যবহার করবেন বা এটি কীভাবে হওয়ার কথা? আমিও এতে নতুন।
স্টিফেন ইয়র্ক

6
নতুন কৌণিক 2 এর @ কমম্পোনেন্টের ভিতরে নির্দেশনা নেই
মাস্টার

38

আপনাকে যা করতে হবে তা হ'ল আপনার সূচি। Html ফাইলের মধ্যে বুস্ট্র্যাপ সিএসএস অন্তর্ভুক্ত।

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">

1
সিডিএন এর পরিবর্তে স্থানীয় উত্স থেকে এটিকে অন্তর্ভুক্ত করার কোনও উপায় আছে কি?
স্পার্ক

1
হ্যাঁ, href কেবল আপনার স্থানীয় ফাইলের পথে সেট করা উচিত। আপনার যদি সমস্যা হয় তবে আপনি যে ওয়েব সার্ভার ব্যবহার করছেন তা থেকে "স্ট্যাটিক ফাইল পরিবেশন করা" অনুসন্ধানের পরামর্শ দেব।
ব্যবহারকারী 2263572

এটি সূচক html ছাড়া অন্য ফাইলগুলির জন্য কৌণিক 6+ তে কাজ করে না। যেমন। app.component.html। অনুগ্রহ করে আমাদেরকে বলুন.
গণেশदेशমুখ


16

আপনি যদি এই থ্রেডে উল্লিখিত কৌণিক-ইউআই টিমের এনজি-বুটস্ট্র্যাপের সাথে প্রয়োজনীয় বুটস্ট্র্যাপ 4 ব্যবহার করার পরিকল্পনা করেন , আপনি পরিবর্তে এটি ব্যবহার করতে চাইবেন (দ্রষ্টব্য: আপনার জেএস ফাইল অন্তর্ভুক্ত করার দরকার নেই):

  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" integrity="sha384-rwoIResjU2yc3z8GV/NPeZWAv56rSmLldC3R/AZzGRnGxQQKnKkoFVhFQhNUwEyJ" crossorigin="anonymous">

আপনি SASS ব্যবহার করছেন তা ধরে নিলে npm install bootstrap@4.0.0-alpha.6 --saveআপনার styles.scssফাইলের ফাইলটির দিকে ইশারা করে আপনি স্থানীয়ভাবে এটি উল্লেখ করতে পারেন :

@import '../../node_modules/bootstrap/dist/css/bootstrap.min.css';

1
আপনি দয়া করে ব্যাখ্যা করতে পারেন কেন আপনার জেএস ফাইল অন্তর্ভুক্ত করার দরকার নেই। এটি এনপিএম ইনস্টল করার কারণে? এছাড়াও, থিয়েরি টেম্পিলারের উদাহরণে, তিনি সতর্কতা ব্যবহারের জন্য এনজি 2-বুটস্ট্র্যাপ / এনজি 2-বুটস্ট্র্যাপ আমদানি করে। বুটস্ট্র্যাপ 4 এর জন্য কি সেখানে একই ব্যবহার রয়েছে?
বিবিসিঞ্জার

ধন্যবাদ। আমি আপনার দ্বিতীয় উদাহরণ চেষ্টা করেছিলাম। আমি একটি ত্রুটি পেয়েছি যে সংস্থানটি নোড_মডিউলগুলি থেকে লোড করতে ব্যর্থ হয়েছে।
বিবিসিঞ্জার

1
আপডেট উত্তর দেখুন। আপনি যদি SASS ব্যবহার করছেন তবে আপনি যা করতে পেরেছেন তা করতে পারেন এবং @importএটি আপনার SASS ফাইলে। যদি তা না হয় তবে আপনি এটি আপনার vendor.tsফাইলে যুক্ত করার চেষ্টা করতে পারেন , তবে আমি এটি আমার কোডটিতে ব্যবহার করছি না।
অনুষ্ঠানগুলি

10

সর্বাধিক জনপ্রিয় বিকল্পটি হল এনজি 2-বুটস্ট্র্যাপ প্রকল্প https://github.com/valor-software/ng2- বুটস্ট্র্যাপ বা কৌণিক UI বুটস্ট্র্যাপ লাইব্রেরির মতো এনপিএম প্যাকেজ হিসাবে বিতরণ করা কিছু তৃতীয় পক্ষের লাইব্রেরি ব্যবহার করা ।

আমি ব্যক্তিগতভাবে এনজি 2-বুটস্ট্র্যাপ ব্যবহার করি। এটি কনফিগার করার বিভিন্ন উপায় রয়েছে কারণ আপনার কৌণিক প্রকল্পটি কীভাবে তৈরি হয় তার উপর কনফিগারেশন নির্ভর করে। আমি কৌনিক 2 কুইকস্টার্ট প্রকল্পের উপর ভিত্তি করে উদাহরণ কনফিগারেশন পোস্ট করি https://github.com/angular/quickstart

প্রথমত আমরা আমাদের প্যাকেজ.জসনে নির্ভরতা যুক্ত করি

    { ...
"dependencies": {
    "@angular/common": "~2.4.0",
    "@angular/compiler": "~2.4.0",
    "@angular/core": "~2.4.0",

    ...

    "bootstrap": "^3.3.7",
    "ng2-bootstrap": "1.1.16-11"
  },
... }

তারপরে আমাদের systemjs.config.js এর যথাযথ URL- তে নামগুলি ম্যাপ করতে হবে

(function (global) {
  System.config({
    ...
    // map tells the System loader where to look for things
    map: {
      // our app is within the app folder
      app: 'app',

      // angular bundles
      '@angular/core': 'npm:@angular/core/bundles/core.umd.js',
      '@angular/common': 'npm:@angular/common/bundles/common.umd.js',
      '@angular/compiler': 'npm:@angular/compiler/bundles/compiler.umd.js',
      '@angular/platform-browser': 'npm:@angular/platform-browser/bundles/platform-browser.umd.js',
      '@angular/platform-browser-dynamic': 'npm:@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js',
      '@angular/http': 'npm:@angular/http/bundles/http.umd.js',
      '@angular/router': 'npm:@angular/router/bundles/router.umd.js',
      '@angular/forms': 'npm:@angular/forms/bundles/forms.umd.js',

      //bootstrap
      'moment': 'npm:moment/bundles/moment.umd.js',
      'ng2-bootstrap': 'npm:ng2-bootstrap/bundles/ng2-bootstrap.umd.js',

      // other libraries
      'rxjs':                      'npm:rxjs',
      'angular-in-memory-web-api': 'npm:angular-in-memory-web-api/bundles/in-memory-web-api.umd.js'
    },
...
  });
})(this);

আমাদের সূচী। Html এ বুটস্ট্র্যাপ। সিএসএস ফাইল আমদানি করতে হবে। আমরা এটি আমাদের হার্ড ড্রাইভের / node_modules / বুটস্ট্র্যাপ ডিরেক্টরি থেকে (কারণ আমরা বুটস্ট্র্যাপ ৩.৩..7 নির্ভরতা যুক্ত করেছি) বা ওয়েব থেকে পেতে পারি। সেখানে আমরা এটি ওয়েব থেকে পেয়েছি:

<!DOCTYPE html>
<html>
  <head>
    ...
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
    ...
  </head>

  <body>
    <my-app>Loading...</my-app>
  </body>
</html>

আমাদের / অ্যাপ ডিরেক্টরি থেকে আমাদের app.module.ts ফাইলটি সম্পাদনা করা উচিত

import { NgModule }      from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';

//bootstrap alert import part 1
import {AlertModule} from 'ng2-bootstrap';

import { AppComponent }  from './app.component';


@NgModule({
  //bootstrap alert import part 2
  imports:      [ BrowserModule, AlertModule.forRoot() ],
  declarations: [ AppComponent ],
  bootstrap:    [ AppComponent ]
})
export class AppModule { }

এবং পরিশেষে / অ্যাপ ডিরেক্টরি থেকে আমাদের app.componal.ts ফাইল

import { Component } from '@angular/core';

@Component({
    selector: 'my-app',
    template: `
    <alert type="success">
        Well done!
    </alert>
    `
})

export class AppComponent {

    constructor() { }

}

তারপরে আমাদের অ্যাপ্লিকেশন চালানোর আগে আমাদের আমাদের বুটস্ট্র্যাপ এবং এনজি 2-বুটস্ট্র্যাপ নির্ভরতা ইনস্টল করতে হবে। আমাদের প্রকল্প ডিরেক্টরিতে গিয়ে টাইপ করা উচিত

npm install

শেষ পর্যন্ত আমরা আমাদের অ্যাপ্লিকেশনটি শুরু করতে পারি

npm start

এনজি 2-বুটস্ট্র্যাপ প্রকল্প গিথুবে অনেকগুলি কোড স্যাম্পল রয়েছে যা দেখায় যে কীভাবে বিভিন্ন কৌণিক 2 প্রকল্প বিল্ডগুলিতে এনজি 2-বুটস্ট্র্যাপ আমদানি করতে হয়। এমনকি plnkr নমুনা আছে। ভালোর-সফ্টওয়্যার (লাইব্রেরির লেখক) ওয়েবসাইটেও এপিআই ডকুমেন্টেশন রয়েছে।


9

কৌণিক-আবহাওয়ার পরিবেশে, আমি খুঁজে পেয়েছি সবচেয়ে সোজা উপায় নীচে:


1. সেক্সি স্টাইলশীট সহ পরিবেশে সমাধান

npm install bootstrap-sass save

স্টাইল.এসএসএসে:

$icon-font-path: '~bootstrap-sass/assets/fonts/bootstrap/';
@import '~bootstrap-sass/assets/stylesheets/bootstrap';

নোট 1: ~অক্ষরটি নোড_মডিউলগুলির ফোল্ডারের একটি উল্লেখ ।
নোট 2: যেহেতু আমরা স্ক্যাস ব্যবহার করছি, আমরা আমাদের চাই সমস্ত বুস্ট্র্যাপ ভেরিয়েবল কাস্টমাইজ করতে পারি।


2. সিএসসি স্টাইলশিট সহ পরিবেশে সমাধান

npm install bootstrap save

স্টাইল। সিএসএসে:

@import '~bootstrap/dist/css/bootstrap.css';

6

বুটস্ট্র্যাপের সাথে কৌণিক 2 কনফিগার করার বিভিন্ন উপায় রয়েছে, এর বেশিরভাগ সর্বাধিক পাওয়ার একটি উপায় হ'ল এনজি-বুটস্ট্র্যাপ ব্যবহার করা, এই কনফিগারেশনটি ব্যবহার করে আমরা আমাদের ডিওএমের উপর অ্যালগুলার 2 এর সম্পূর্ণ নিয়ন্ত্রণ প্রদান করি, জিকিউরি এবং বুস্ট্র্যাপ ব্যবহারের প্রয়োজনীয়তা এড়িয়ে চলে .js।

1-একটি সূচনা পয়েন্ট হিসাবে ধরুন একটি নতুন প্রকল্প অ্যাংুলার-সিএলআই দিয়ে তৈরি করা হয়েছে এবং কমান্ড লাইনটি ব্যবহার করে এনজি-বুটস্ট্র্যাপ ইনস্টল করুন:

npm install @ng-bootstrap/ng-bootstrap --save

দ্রষ্টব্য: https://ng-bootstrap.github.io/#/getting-st সূত্রে আরও তথ্য

2-তারপরে আমাদের সিএসএস এবং গ্রিড সিস্টেমের জন্য বুটস্ট্র্যাপ ইনস্টল করতে হবে।

npm install bootstrap@4.0.0-beta.2 --save

দ্রষ্টব্য: https://getbootstrap.com/docs/4.0/getting-st সূত্র / ডাউনলোড/ এ আরও তথ্য

এখন আমাদের পরিবেশ সেটআপ হয়েছে এবং তার জন্য আমাদের .angular-cli.json পরিবর্তন করতে হবে শৈলীতে:

"../node_modules/bootstrap/dist/css/bootstrap.min.css"

এখানে একটি উদাহরণ:

"apps": [
    {
      "root": "src",
        ...
      ],
      "index": "index.html",
       ...
      "prefix": "app",
      "styles": [
        "../node_modules/bootstrap/dist/css/bootstrap.min.css",
        "styles.css"
      ],
      "scripts": [],
      "environmentSource": "environments/environment.ts",
      "environments": {
        "dev": "environments/environment.ts",
        "prod": "environments/environment.prod.ts"
      }
    }
  ]

পরবর্তী পদক্ষেপটি হ'ল আমাদের প্রকল্পে এনজি-বুস্ট্রেপ মডিউল যুক্ত করা, এটি করার জন্য আমাদের অ্যাপ.মডিউল.টস যোগ করতে হবে:

import { NgbModule } from '@ng-bootstrap/ng-bootstrap';

তারপরে অ্যাপ্লিকেশন অ্যাপ্লিকেশনটিতে নতুন মডিউল যুক্ত করুন: এনগিবডমডিউল.ফরুট ()

উদাহরণ:

@NgModule({
  declarations: [
    AppComponent,
    AppNavbarComponent
  ],
  imports: [
    BrowserModule,
    NgbModule.forRoot()
  ],
  providers: [],
  bootstrap: [AppComponent]
})

এখন আমরা আমাদের কৌনিক 2/5 প্রকল্পে বুটস্ট্র্যাপ 4 ব্যবহার শুরু করতে পারি।


3

আমার একই প্রশ্ন ছিল এবং এই নিবন্ধটি সত্যিই পরিষ্কার সমাধান সহ পেয়েছি:

http://leon.radley.se/2017/01/angular-cli-and-bootstrap-4/

এখানে নির্দেশাবলী, কিন্তু আমার সরলিকৃত সমাধান সহ:

বুটস্ট্র্যাপ 4 ইনস্টল করুন ( নির্দেশাবলী ):

npm install --save bootstrap@4.0.0-alpha.6

যদি প্রয়োজন হয় তবে আপনার এসসিআর / স্টাইলস সিএসএসের নাম পরিবর্তন করে স্টাইলসএসএসএস করুন এবং পরিবর্তনটি প্রতিবিম্বিত করতে .angular-cli.json আপডেট করুন :

"styles": [
  "styles.scss"
],

তারপরে এই লাইনটি স্টাইলস.এসএসএসে যুক্ত করুন :

@import '~bootstrap/scss/bootstrap';

3

কেবলমাত্র আপনার প্যাকেজ.জসন ফাইল পরীক্ষা করুন এবং বুটস্ট্র্যাপের জন্য নির্ভরতা যুক্ত করুন

"dependencies": {

   "bootstrap": "^3.3.7",
}

তারপরে .angular-cli.jsonফাইলের নীচে কোড যুক্ত করুন

 "styles": [
    "styles.css",
    "../node_modules/bootstrap/dist/css/bootstrap.css"
  ],

শেষ অবধি আপনি টার্মিনাল ব্যবহার করে স্থানীয়ভাবে আপনার এনপিএম আপডেট করুন

$ npm update

2
  1. এনপিএম ইনস্টল - সেভ বুটস্ট্র্যাপ
  2. -> কৌণিক-ক্লিপ.জসন ফাইলটিতে যান, শৈলীর বৈশিষ্ট্য সন্ধান করুন এবং কেবল পরবর্তী স্টিং যুক্ত করুন: "../node_modules/bootstrap/dist/css/bootstrap.min.css", এটি দেখতে এর মতো দেখাবে:

    "styles": [
    "../node_modules/bootstrap/dist/css/bootstrap.min.css",
    "styles.css"
    ],

2

কৌণিক 6+ এবং বুটস্ট্র্যাপ 4+ সহ পদ্ধতি:

  1. আপনার প্রকল্পের ফোল্ডারে একটি শেল খুলুন
  2. কমান্ডটি সহ বুটস্ট্র্যাপ ইনস্টল করুন: npm install --save bootstrap@4.1.3
  3. বুটস্ট্র্যাপের জন্য নির্ভরতা jquery প্রয়োজন, সুতরাং আপনার যদি এটি না থাকে তবে আপনি কমান্ডটি দিয়ে এটি ইনস্টল করতে পারেন: npm install --save jquery 1.9.1
  4. কমান্ডটি দিয়ে আপনার দুর্বলতা ঠিক করতে হবে: npm audit fix
  5. আপনার মূল স্টাইল.এসএসএস ফাইলে, নিম্নলিখিত লাইনটি যুক্ত করুন: @import "../node_modules/bootstrap/dist/css/bootstrap.min.css";

অথবা

এই লাইনটি আপনার মূল সূচক html ফাইলে যুক্ত করুন: <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">


1

আমি একই উত্তর খুঁজছিলাম এবং অবশেষে আমি এই লিঙ্কটি খুঁজে পেয়েছি। আপনার কৌণিক 2 প্রকল্পে বুটস্ট্র্যাপ সিএসএস যুক্ত করার জন্য আপনি তিনটি ভিন্ন উপায় ব্যাখ্যা করতে পারেন find এটা আমাকে সাহায্য করেছে।

এখানে লিঙ্কটি দেওয়া হয়েছে: http://codingthesmartway.com/used-bootstrap-with-angular/


1

আমার সুপারিশটি এটি জেসন স্টাইলাসে ঘোষণার পরিবর্তে এটি স্ক্যাসে রাখার জন্য হবে যাতে সবকিছু সংকলিত হয় এবং এক জায়গায় থাকে।

1) এনপিএম সহ বুটস্ট্র্যাপ ইনস্টল করুন

 npm install bootstrap

2) আমাদের স্টাইলগুলির সাথে সিএসএসে বুটস্ট্র্যাপ এনপিএম ঘোষণা করুন

তৈরি করুন _bootstrap-custom.scss:

  // Required
  @import "bootstrap-custom-required";


  // Optional
  @import "~bootstrap/scss/root";
  @import "~bootstrap/scss/grid";
  @import "~bootstrap/scss/tables";

    ...
    ..
    .

3) স্টাইলস.এসএসএস এর মধ্যে আমরা সন্নিবেশ করান

@import "bootstrap-custom";

সুতরাং আমরা আমাদের সমস্ত কোর সংকলন এবং এক জায়গায় থাকবে


0

আপনি Prettyfox UI 'তে লাইব্রেরি ব্যবহার করার চেষ্টা করতে পারেন http://ng.prettyfox.org

এই লাইব্রেরিতে বুটস্ট্র্যাপ 4 টি স্টাইল ব্যবহার করা হয়েছে এবং জ্যাকুয়ের দরকার নেই।


0

আপনার এইচটিএমএল পৃষ্ঠায় নিম্নলিখিত লাইনগুলি যুক্ত করুন

<script src="https://cdnjs.cloudflare.com/ajax/libs/ng2-bootstrap/x.x.x/ng2-bootstrap.min.js"></script>

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet">

0

আপনি যদি কৌণিক ক্লিপ ব্যবহার করেন, প্যাকেজ.জসনে বুটস্ট্র্যাপ যুক্ত করার পরে এবং প্যাকেজটি ইনস্টল করার পরে, আপনার কেবলমাত্র বুস্ট্র্যাপ.মিন.এসএসএসকে .angular-cli.json এর "স্টাইল" বিভাগে যুক্ত করতে হবে।

একটি গুরুত্বপূর্ণ বিষয় হ'ল "আপনি যখন .angular-cli.json এ পরিবর্তন করেন আপনি কনফিগারেশন পরিবর্তনগুলি গ্রহণ করতে এনজি সার্ভিসটি পুনরায় শুরু করতে হবে" "

সূত্র:

https://github.com/angular/angular-cli/wiki/stories-include-bootstrap


আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.