在Angular中，原生的Angular库并不直接提供设置、获取和清除cookie的功能。但是，你可以使用一些第三方的库，如ngx-cookie-service，或者通过JavaScript的原生方法来操作cookie。
使用JavaScript原生方法
- 设置Cookie
你可以使用document.cookie来设置cookie，如下所示：
document.cookie = "username=John Doe; expires=Thu, 18 Dec 2023 12:00:00 UTC; path=/";
这将创建一个名为username，值为John Doe的cookie，该cookie在2023年12月18日过期，并且对整个网站（/路径）都可用。
2. 获取Cookie
要获取一个cookie的值，你可以编写一个函数来解析document.cookie字符串，如下所示：
function getCookie(name) {
const value = `; ${document.cookie}`;
const parts = value.split(`; ${name}=`);
if (parts.length === 2) return parts.pop().split(';').shift();
return null;
}
const username = getCookie("username");
console.log(username); // 输出: John Doe
- 清除Cookie
要清除一个cookie，你可以设置它的过期日期为一个过去的时间，如下所示：
document.cookie = "username=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;";
这将使名为username的cookie立即过期，从而被浏览器清除。
使用ngx-cookie-service库
如果你更喜欢使用Angular的方式，你可以安装并使用ngx-cookie-service库。这个库提供了一些方便的方法来设置、获取和清除cookie。
- 安装
首先，你需要使用npm或yarn来安装这个库：
npm install ngx-cookie-service --save
# 或者
yarn add ngx-cookie-service
- 导入并使用
在你的Angular模块中（通常是app.module.ts），你需要导入CookieService并将其添加到providers数组中：
import { CookieService } from 'ngx-cookie-service';
@NgModule({
// ...
providers: [CookieService],
// ...
})
export class AppModule { }
然后，在你的组件或服务中，你可以注入CookieService并使用它的方法来设置、获取和清除cookie：
import { CookieService } from 'ngx-cookie-service';
@Component({
// ...
})
export class MyComponent {
constructor(private cookieService: CookieService) { }
setCookie() {
this.cookieService.set('username', 'John Doe', 10, '/', null, null, 'Lax');
}
getCookie() {
const username = this.cookieService.get('username');
console.log(username); // 输出: John Doe
}
clearCookie() {
this.cookieService.delete('username', '/');
}
}